[html/css] Kan niet scrollen met muis in div-je

Pagina: 1
Acties:
  • 240 views sinds 30-01-2008
  • Reageer

Acties:
  • 0 Henk 'm!

  • Mac_Cain13
  • Registratie: Juni 2003
  • Laatst online: 20-05 01:14
Ik was weer eens aan het prutsen aan mijn site en kwam tot de ontdekking dat ik niet met het muiswieltje kan scrollen in een divje, ook niet als je er eens in klikt en je muis er gewoon boven houd. Dit doet zich iig voor in Mozilla en Internet Explorer.
Dit is natuurlijk zeer frustrerent en ik ben al tijden bezig dat wieltje aan de praat te krijgen, maar zonder resultaat helaas. :(

Mijn site is ongeveer alsvolgt opgebouwdt. (Normaal zit er ook nog een menu en een banner in de main div, maar deze hebben geen invloed op mijn probleem.)
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" [knip]>
<html>
<head>
    <title>Welkom</title>
    <link rel="stylesheet" type="text/css" href="default.css" />
</head>
<body>
    <div class="split">
        <div id="main">
            <div id="content">
                [inhoud]
            </div>
        </div>
    </div>
</body>
</html>

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
div.split
{
    position: absolute;
    left: 50%;
    top: 50%;
}

div#main
{
    position: absolute;
    left: -350px;
    top: -250px;
    width: 700px;
    height: 500px;
    
    border: solid 1px;
}

div#content
{
    position: absolute;
    left: 0px;
    top: 0px;
    height: 500px;
    width: 680px;
    
    background-color: #ffb401;
    padding: 0px 10px 0px 10px;
    overflow: auto;
}
[CSS voor andere div-jes enz]

Er lijkt mij niet zoveel bijzonders in de CSS of HTML te staan en ik begrijp dan ook niet waarom dat scrollwiel niet mee wil werken. Doe ik iets fout met de overflow? Of positioneer ik mijn site op een verkeerde manier in het midden van het scherm?

Ik heb een voorbeeldje (down gehaald) van mijn probleem online staan. Deze is alleen berijkbaar als mijn PC aan staat, maar mss wel handig om het probleem even snel te bekijken.

Ik heb echt geen idee meer waar ik het zoeken moet, hopelijk is er iemand die mij hier verder mee kan helpen. Alvast bedankt! :)

[ Voor 9% gewijzigd door Mac_Cain13 op 27-09-2004 20:54 ]


Acties:
  • 0 Henk 'm!

  • job
  • Registratie: Februari 2002
  • Laatst online: 01:35

job

Het werkt hier prima... :?
IE6 winxp sp2

Acties:
  • 0 Henk 'm!

Anoniem: 24491

Bekend "probleem"

[rml][ HTML] Layer op mijn website scrollt niet met muiswieltje[/rml]

staan een aantal antwoorden, kijk vooral naar de laatste.

Acties:
  • 0 Henk 'm!

  • Bram77
  • Registratie: September 2004
  • Laatst online: 10-07-2023
Hier ook.
IE 6.029 beta , SP2 beta

Acties:
  • 0 Henk 'm!

  • Mac_Cain13
  • Registratie: Juni 2003
  • Laatst online: 20-05 01:14
job schreef op 27 september 2004 @ 18:09:
Het werkt hier prima... :?
IE6 winxp sp2
Hmm, dat is raar. Ik heb hier Mozilla Firefox 0.9.3 op Linux en dat werkt niet. Op school heb ik het met Mozilla Firefox 0.10 PR en Internet Explorer 6 op Windows 98 SE geprobeerd, maar dat werkte niet. (IE pakte na een aantal keer proberen ineens wel de scrollwiel, maar waarom is mij een raadsel.)

edit:
Hmm, IE6 lijkt het dus wel te doen. Dan zal er op school wel iets aan de hand zijn geweest. Het probleem lijkt dan dus Mozilla/IE 5 specifiek te zijn. Ik zal een even het topic waar Shadow3333 naar linkte doornemen en kijken of er een oplossing werkt.

iig bedankt voor de super snelle reacties! :)

edit:
Ik ben druk bezig met de laatste oplossing in het genoemde topic en dit lijkt te werken! :D Nu nog even kijken wanneer ik de focus moet setten enzo, maar dat moet met wat tweaken zeker wel lukken! Heel erg bedankt!

[ Voor 41% gewijzigd door Mac_Cain13 op 27-09-2004 18:32 . Reden: Ben traag :P ]


Acties:
  • 0 Henk 'm!

Anoniem: 32071

In de recente 1.8a builds van Mozilla werkt het ook.

Acties:
  • 0 Henk 'm!

  • Mac_Cain13
  • Registratie: Juni 2003
  • Laatst online: 20-05 01:14
Anoniem: 32071 schreef op 27 september 2004 @ 18:39:
In de recente 1.8a builds van Mozilla werkt het ook.
Hmm, is die bug daar expliciet geplet? Rond de tijd dat jij post heb ik die site namelijk net voorzien van het nodige javascriptje om het scrollen te laten werken. Dus het kan zijn dat het daarom werkte. Het door mij aangeroepen scriptje is het volgende, mss handig voor andere mensen met dit probleem.

JavaScript:
1
2
3
4
5
6
function setScroll()
{
    scroll = document.getElementById('content').scrollTop;
    document.getElementById('scroll').focus();
    document.getElementById('content').scrollTop = scroll;
}

Het element 'content' is het div-je en 'scroll' is een Anchor met alleen een id en verder helemaal niets. Dit werkt perfect en ik kan deze functie nu gewoon aanroepen om dat div-je de focus te geven en te scrollen met mijn wieltje.

Het enige kleine dingetje waar ik nog mee zit is wanneer ik de functie moet aanroepen. Hij staat nu onder de onclick van het divje, maar ik kan nu niet meer op bijv een tekstvak klikken zonder dat de focus wegspringt naar het divje. Ik zal hier nog even mee bezig, maar tips zijn natuurlijk altijd welkom!

[ Voor 10% gewijzigd door Mac_Cain13 op 27-09-2004 22:11 ]


Acties:
  • 0 Henk 'm!

Anoniem: 24491

onmouseover bij de div?

Acties:
  • 0 Henk 'm!

  • Mac_Cain13
  • Registratie: Juni 2003
  • Laatst online: 20-05 01:14
Het vervelende van onmouseover bij de div is dat je je muis verplicht boven het textvakje moet laten zweven om de focus niet van het vakje te laten springen.

Ik heb hem nu onload bij de body staan dit werkt prima, maar je moet nu de site verversen om de focus terug goed te krijgen. Onclick op de div leek goed te werken tot ik merkte dat je dan dus ook niet meer een tekstvakje aan kan klikken.

Iets als conteroleren waar de focus op dit moment ligt zou perfect zijn. Dus als de focus op een element binnen de div ligt niet de focus verzetten bij een mouseover in alle andere gevallen wel. Misschien dat er een manier is om zoiets op te vragen. Ik ken iig niet zo'n truukje, mss een medeGoTter of Google wel. :P Ik houd mij iig aanbevolen.

Acties:
  • 0 Henk 'm!

  • JoeKurr
  • Registratie: Juli 2001
  • Laatst online: 29-01 09:50

JoeKurr

Past niet in een MiG-21

Ik heb dit van de bugzilla website:

code:
1
2
3
4
5
function fixScroll(div) {
  var s = div.scrollTop;
  div.childNodes[1].focus();
  div.scrollTop = s;
}


en de code van de div:

code:
1
2
3
4
<div onmouseover="fixScroll(this);">
  <a></a>
  Text text text...
</div>


Dit werkt wel, maar het nadeel is dat je pagina steeds op en neer staat te springen als je naar beneden scrollt.

Dutch Flanker Display Team
You can't be lost if you don't care where you are

Pagina: 1