one6666
Mitglied Titanium
Hallo,
ich habe mit beiden Versionen Probleme
Frage 2: Wie bekomm ich den onmousewheel Event dazu immer wieder Events zu feuern ?
Zu Frage 2 hier ein Beispiel Code:
ich habe mit beiden Versionen Probleme
- onscroll: Schiest nur dann einen Event wenn die Box auf der der Event angewand wird die Eigenschafft overflow:scroll; besitzt,
somit sieht man immer den echten Scrollbar aber ich will ja einen eigenen haben
- onmousewheel: Der Event Händler schießt auch mit der Eigenschafft overflow:hidden; ein Event aber der schieß das Event nur einmal,
ein mal gedreht nach unten = - einmal nach oben = + also nur + und - aber auch nicht die ganze Zeit halt nur einmal
Frage 2: Wie bekomm ich den onmousewheel Event dazu immer wieder Events zu feuern ?
Zu Frage 2 hier ein Beispiel Code:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Scrollbar</title>
<script type="text/javascript">
function MouseScroll (event) {
if (event.wheelDelta === undefined) {
rolled = -40 * event.detail;
rolled /=2;
}
else {
rolled = event.wheelDelta;
rolled /=2;
}
document.getElementById("scroll_div").style.top = rolled + "px";
}
function Init () {
var elem = document.getElementById ("myDiv");
if (elem.addEventListener) {
elem.addEventListener ("DOMMouseScroll", MouseScroll, false);
}
}
</script>
</head>
<body onload="Init()">
<div id="myDiv" onmousewheel="MouseScroll(event)" style="overflow:hidden; width:100px; height:200px; border:#6CC 1px solid; background:#3CC;">
<div id="scroll_div" style="position:relative;">
Inhalt_1<br />Inhalt_2<br />Inhalt_3<br />Inhalt_4<br />Inhalt_5<br />Inhalt_6<br />Inhalt_7<br />Inhalt_8<br />
Inhalt_9<br />Inhalt_10<br />Inhalt_11<br />Inhalt_12<br />Inhalt_13<br />Inhalt_14<br />Inhalt_15<br />Inhalt_16<br />
</div>
</div>
</body>
</html>