Topic: OverText problem with Mif.Tree.mootools-patch.js when scroll down t
OverText problem with Mif.Tree.mootools-patch.js after scroll down the page.
overtext example without Mif.Tree.mootools-patch.js is http://jsbin.com/alili
overtext example with Mif.Tree.mootools-patch.js is http://jsbin.com/ojuka3
the reason is that mif tree override Element.getPosition method.
source code is following:
<!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" xml:lang="en" lang="en">
<head>
<script src="http://www.clientcide.com/scripts/clientside.moo.v1.2.packed.js"></script>
</head>
<body>
<pre>position stub<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>position stub</pre>
<style>
label.overTxtLabel {
font-weight: bold;
font-family: arial, helvetica, verdana;
font-size: 12px;
color: #999;
}
</style>
<input id="overTextTest" alt="Enter some text here" style="width: 300px;">
<pre>position stub<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>position stub</pre>
<pre>position stub<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>position stub</pre>
<script type="text/javascript">
try{
if(document.documentElement.getBoundingClientRect){//ie, opear9.5+, ff3+
Element.implement({
getPosition: function(relative){
rect=this.getBoundingClientRect();
var clientTop = document.html.clientTop || document.body.clientTop || 0, clientLeft = document.html.clientLeft || document.body.clientLeft || 0
var position={x: rect.left-this.scrollLeft-clientLeft, y:rect.top-this.scrollTop-clientTop};
var relativePosition = (relative && (relative = $(relative))) ? relative.getPosition() : {x: 0, y: 0};
return {x: position.x - relativePosition.x, y: position.y - relativePosition.y};
}
});
}
new OverText($('overTextTest'));
}catch(ex){
alert("error " + ex.name +", " + ex.message);
}
</script>
</body>
</html>
