It seems the border is not taken into account in the JS offsetTop/Left properties, in FF 3.6. Excerpts
Code:
<div id="wall">
<div id="small" class="zimg">
<img src="..." 300x200/>
</div>
<br style="clear:both />
</div>
Some CSS
Code:
.zimg {
border:20px solid #ddd;
background:#eee;
overflow:hidden;
position:relative;
}
#wall {
margin:50px 0 0 50px;
}
#small {
width:300px;
height:200px;
float:left;
}
And a JS function to calculate the relative (x,y) coordinates of the mouse over the IMG
Code:
function objabs(o)
{
var x = 0,y = 0;
console.log("get_abs: of "+o.id);
while (o) {
console.log(" "+o.id+" x("+o.offsetLeft+") y("+o.offsetTop+") P:"+(o.offsetParent ? o.offsetParent.id : o.offsetParent));
x += o.offsetLeft;
y += o.offsetTop;
o = o.offsetParent;
}
return [x,y];
}
Result: mouse (x,y) are always off by the size of the border (20px).
(console.log() is from Firebug to get a proof!:
smpic x(0) y(0) P:small
small x(50) y(50) P:
x(0) y(0) P:null
50px is the '#wall' margin, border is nowhere.
The border is not taken into account in the calculation - is it a bug (FF or mine)?
Thanks
nb: sorry for the double post but I cannot delete the thread in css - and the JS is probably more appropriate.
Last edited by css; 02-03-2010 at 09:40 AM..
|