Hallo,
mit componentFromPoint kann ich feststellen, ob ein Maus-Event auf einem Scrollbar eines Elements stattgefunden hat. Aber nur in IE.
Wenn Du sagst, wozu _genau_ Du das brauchst, gibt es eventuell eine Lösungsmöglichkeit, die ohne das Abfragen von Maus-Events auf den Scrollbars auskommt.
Hat jemand eine Idee, wie ich dasselbe im Firefox bewerkstelligen kann?
Nein, dasselbe kann man mit FireFox nicht bewerkstelligen. Man kann versuchen, zumindest herauszubekommen, ob der Maus-Event einen Scrollbar als Ziel hatte, aber an die einzelnen Teile des Scrollbars, wie bei MSIE-Element.componentFromPoint, kommt man nicht heran.
Kurzes Beispiel zur weiteren Diskussion:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Beschreibung der Seite</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
h1 { width:500px; height:400px; background-color:#FF0; }
#scrollDiv { width:300px; height:50px; overflow:auto; background-color:#FF0; }
</style>
<script type="text/javascript">
<!--
function trackElement(e, mouseMoveElem){
if(!e) e = window.event;
var sElem = "";
if(typeof mouseMoveElem.componentFromPoint != "undefined") {
sElem = mouseMoveElem.componentFromPoint(
e.clientX,
e.clientY
);
} else if (typeof e.target != "undefined" && typeof e.pageX != "undefined") {
sElem = e.target;
if (sElem == mouseMoveElem) {
if (typeof sElem.scrollHeight != "undefined" && typeof sElem.clientHeight != "undefined" && typeof e.pageX != "undefined") {
//Das Element muss direkt im Body stehen, sein offsetParent darf also nicht noch einen offsetParent mit einem offsetLeft/-Top haben.
if (sElem.scrollHeight > sElem.clientHeight && e.pageX-sElem.offsetLeft > sElem.clientWidth) {
sElem += "rechteVertikaleScrollbar";
} else if (sElem.scrollWidth > sElem.clientWidth && e.pageY-sElem.offsetTop > sElem.clientHeight) {
sElem += "untereHorizontaleScrollbar";
}
}
}
}
document.getElementById("monitor").innerHTML = "mousemove " + e.clientX + ", "
+ e.clientY +
" The mouse pointer is hovering over: " + sElem;
if (typeof e.stopPropagation != "undefined") e.stopPropagation();
if (e.cancelBubble == false) e.cancelBubble = true;
}
window.onload = function() {
document.documentElement.onmousemove = function(e){trackElement(e, this)};
document.getElementById("scrollDiv").onmousemove = function(e){trackElement(e, this)};
}
//-->
</script>
</head>
<body>
<div id="monitor"> </div>
<div id="scrollDiv">Test<br>TestTest<br>TestTest<br>TestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest<br>Test</div>
<h1>Test</h1>
</body>
</html>
Quellen zum Nachlesen für Mozilla:
http://developer.mozilla.org/en/docs/DOM:element
http://developer.mozilla.org/en/docs/DOM:event
viele Grüße
Axel