Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

div tags in java script document.write()

Status
Not open for further replies.

mayfair

Programmer
Jun 29, 2001
12
US
I have the code

document.write(&quot;<div id='picture3' style='position:absolute; left:560px; top:500px;width:147px; height:143px; z-index:2'><img src='&quot;+myImages[ry]+&quot; ALIGN=RIGHT></div>&quot;);

What I need it to do is display the image and to position it on the screen. It displays it just fine, but doesn't move it. Any help is appreciated. Thanks
 
hie
it works for me in ie5.0 but dont forget
document.write(&quot;<div id='picture3' style='position:absolute; left:560px; top:500px;width:147px; height:143px; z-index:2'><img src='&quot;+myImages[ry]+&quot;' ALIGN=RIGHT></div>&quot;);

what browser do u use?
this works for nn4.x:
<html>
<head>
<title>position in nn</title>
<style>
#picture3{
position:absolute;
left:560px;
top:500px;
width:147px;
height:143px;
z-index:2;
}
</style>
</head>

<body bgcolor=&quot;#FFFFFF&quot;>
<script>
myImages='hhh.gif'
document.write(&quot;<div id='picture3' ><img src='&quot;+myImages+&quot;' ALIGN=RIGHT></div>&quot;);
</script>
</body>
</html>
regards, vic
 
I'm using netscape 4.5, and the code isn't working for me. It isn't displaying a picture but when I take the div stuff out of the document.write the picture shows up fine. Any hints on how to solve this.
Thanks
Tyrone
 
i just re-checked my code, (green in my prev post) it works in nn4.61; dont kno about others.. regards, vic
 
You need to clarify what you mean by move? The code you have presented will write to the screen and display an image at the exact coords you have specified. There will, however, be no movement it will just be displayed at TOP:(y-coord) and LEFT:(x-cood) in pixels.

You need to script movement, like so..........

Netscape | Internet Explorer
yourElementID.style.posLeft or yourElementID.style.pixelLeft

**The style property LEFT: is referred to as posLeft or pixelLeft according to the browser.**

You can see that you need to call the same LEFT element different names according to the browser displaying your page. Thus begins the cross-browser nightmare.
 
I'm meaning by move, no matter what what top and left coordinates I give it, it's always in the same spot. top, right corner, it just won't move
 
I think I get what you mean, when I ran the code it worked fine, meaning it moved wherever I told it to. I think what you want is to move just the picture around, although the pic should move with the div tags, what is currently happening is that you are moving the div tags with the LEFT and TOP coords and the pic is rendered exactly where you told it to be inside the div tag ALIGNED RIGHT (rightside corner). If you want to just move the pic around get rid of ALIGN=RIGHT property and put all the style&quot;&quot; attributes inside of the IMG tag. The pic needs to have position:absolute; in order for you to move the pic around. YOU COULD JUST GET RID OF THE DIV TAG IF YOU WERE TO DO WHAT I HAVE SAID.

I changed your code only slightly............

<SCRIPT>

var myImage = &quot;images/bullet.gif&quot;;

function sew(){

document.write(&quot;<div id='picture3' style=\&quot;position:absolute; background-color:green; width:100px; height:100px; z-index:2; top:500px; left:500px;\&quot;><img src='&quot; + myImage + &quot;\'align='right'></div>&quot;);
}
</script>
</head>

<body onclick=&quot;sew();&quot;>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top