Welcome to WebmasterWorld Guest from 35.175.191.168

Forum Moderators: open

Message Too Old, No Replies

Moving DIV Around in Firefox

style.left and style.top

     
12:16 am on Aug 2, 2006 (gmt 0)

New User

10+ Year Member

joined:Aug 2, 2006
posts:2
votes: 0


Hi,

I have the following simple HTML that works in IE, but not in Firefox. How can I make it work in Firefox?

Thanks in advance!

// Ken

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>CSS Positioning</title>

<style type="text/css">

</style>

<script type="text/javascript">

var atTop = false;

function moveBullsEye()
{
var bullsEye = document.getElementById( "bullseye" );

if (atTop == false)
{
bullsEye.style.top = 10;
bullsEye.style.left = 300;
atTop = true;
}
else // true
{
bullsEye.style.top = 300;
bullsEye.style.left = 300;
atTop = false;
}

} // moveBullsEye

</script>

</head>

<body>
<a name="top"></a>

<div style="z-index: 100; position: absolute; left: 100px; top: 100px;" id="bullseye" ><img src='./images/map/map_highlight_dot.gif'/>
</div>

<input type="button" value="Move!" onClick="moveBullsEye();"/>

</body>

</html>

6:22 am on Aug 2, 2006 (gmt 0)

Senior Member

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:May 26, 2000
posts:37301
votes: 0


Not sure if this is the only issue or the important one, but your DTD is kind of schizophrenic -- the first part is transitional and the end part is strict.
2:04 pm on Aug 2, 2006 (gmt 0)

New User

10+ Year Member

joined:Aug 2, 2006
posts:2
votes: 0


Thanks for the catch. I changed the Transitional to Strict, but it did not help.

I remember reading something about Firefox's liking to see DIVs declared using the "XML style". How is that done? Does anyone have any examples of declaring DIVs using "XML style"? I have DIVs that contain text, graphics and embedded DIVs. I don't seem to be able to make them work.

Thanks!

// Ken