...

View Full Version : style.posTop in Firefox



Ultragames
06-17-2007, 07:20 AM
I cannot get Firefox 2.0.0.4 to reposition an object by changing the top of posTop attribute of the objects style. This workins in IE and Safari, but not Firefox.


function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
curleft = obj.offsetLeft
curtop = obj.offsetTop
while (obj = obj.offsetParent) {
curleft += obj.offsetLeft
curtop += obj.offsetTop
}
}
return [curleft,curtop];
}

function ProposalInfoRollOver(id, obj) {
position = findPos(obj);

floater = document.getElementById('floater_'+id);
floater.style.display = 'block';
floater.style.posTop = (position[1]+8);
floater.style.posLeft = (position[0]-floater.offsetWidth+1);
}

Any ideas?

Mr J
06-17-2007, 08:07 AM
Try

floater.style.top = (position[1]+8);
floater.style.left = (position[0]-floater.offsetWidth+1);

Ultragames
06-17-2007, 08:09 AM
THank you, but I have tried that. Setting those values in Firefox does nothing on my attempts.

Mr J
06-17-2007, 08:29 AM
You also need to add position:absolute

floater.style.position="absolute"

Ultragames
06-17-2007, 09:19 AM
The absolute positioning has already been added in the CSS. And setting or alerting style.top, or style.posTop does not work in Firefox.

Can anyone help?

Mr J
06-17-2007, 10:21 AM
posTop or posLeft will not work in Firefox

Are you alerting style.top or floater.style.top

Post your full code

Here's what I've been working with and it moves the divs in Firefox


<script type="text/javascript">
function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
curleft = obj.offsetLeft
curtop = obj.offsetTop
while (obj = obj.offsetParent) {
curleft += obj.offsetLeft
curtop += obj.offsetTop
}
}
return [curleft,curtop];
}

function ProposalInfoRollOver(id, obj) {
position = findPos(obj);

floater = document.getElementById('floater_'+id);
floater.style.display = 'block';
floater.style.top = (position[1]+8);
floater.style.left = (position[0]-floater.offsetWidth+1);
}
</script>


<div id="floater_1" style="position:absolute;left:50px;top:50px;width:50px;border:1px solid black" onclick="ProposalInfoRollOver(1,this)">One</div>
<div id="floater_2" style="position:absolute;left:50px;top:100px;width:50px;border:1px solid black" onclick="ProposalInfoRollOver(2,this)">Two</div>
<div id="floater_3" style="position:absolute;left:50px;top:150px;width:50px;border:1px solid black" onclick="ProposalInfoRollOver(3,this)">Three</div>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum