top and left position of document element

[Sarky78]

Hi

I have got a style sheet that defines where a layer appears on the page. i want to be able to get the top and the left positions of this element using javascript. The code below gives me the top position when i define the position in the document, but when i move that position into the style sheet the code returns nothing. is there any way that i can picl up this position from the style sheet, or will i have to define the position in the document.

alert(document.all['line'].style.top);

 

[aperfectcircle]

Try:
document.getElementById("mylayer&quot.style.top

 

[Sarky78]

thanks for the response, but that is doing the same as the code that i had. it seems like the positions can't be picked up if they are defined in a style sheet. if they are defined on the page then it can pick up the positions with both your code and my code.

cheers anyway, will look to find another way of doing it

 

[aperfectcircle]

Where are you putting the javascript? That could be your problem...

 

[Sarky78]

at the moment the javascript is in the page with the layers in it, that get there positions from the style sheet. eventually, all of the javascript will be in an external file as well i would have thought !

 

[aperfectcircle]

It is known that to get this to work in N6 you do need to define the style using the style tag instead of in the stylesheet. But I didn't think it was a problem in IE... Looks like it must be.

I'll mess with it a little bit and let you know if I come up with anything.

 

[baad]

u're ofcourse launchin this code onload or after layer definition, rite?
'coz if u arent then this layer just havent been created in the moment u're callin it..
at least it was my main mistake in the very beginnin.. it was makin me crazy >:-< ... may be i am now? regards, vic

 

[Sarky78]

yes the code is called onclick of the layer it is going to be used to put a border around the layer that was clicked to highlight to the user which layer is currently active, we have defined the positions in the code at the moment but i would like to be able to use this method if it is possible.

 

[baad]

culd u plz paste here a small problem piece of code, in wich u guess the bugg is..
or just how u set ur stylesheet & how & where u call ur script & where egg-zactly ur code (function or whateva) is in ur page

thunx regards, vic

 

[Sarky78]

right the stylesheet is brought in at the top of the page (history) as notmal with:

<link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;../styles/sheet.css&quot;>

in the style sheet the layer positions are defined using:

.his6 { position:absolute; z-index:200; left:260px; top:303px; width:44; height:44;}

back in the history page the line after the stylesheet import is the line that includes the javascript:

<script language=&quot;javascript&quot; src=&quot;../scripts/script.js&quot;></script>

and in this file there is a function called showBorders, which at the moment only contains:

alert(document.all['line'].style.top);

this is currently returning nothing, but when the layer position is defined in the div tag the top and left position can be read.

the layers themselves look like this:

<div id=&quot;his6&quot; class=&quot;his6&quot;>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD class=&quot;navboxc&quot; id=&quot;history6&quot;><A href=&quot;javascript:showLayer('chis6');javascript:showBorder('chis6')&quot; class=&quot;subnav&quot; onmouseover=&quot;rollon('history6','c')&quot; onClick=&quot;javascript:this.blur();&quot; onmouseout=&quot;rolloff('history6','c')&quot;>1996</A></TD>
</TR>
</TABLE>
</DIV>

hope this helps you understand the problem more

 

[baad]

well, i think, i got it to work..
first, try 2 use the followin instead of ur code:
alert(document.all['hiss6'].offsetTop);
then
u arent 2 write
<A href=&quot;javascript:showLayer('chis6');javascript:showBorder('chis6')&quot;
u shuld use just ; instead..
next.. u shuldnt give same names 2 different objects/properties/names/etc (ur div has id &quot;his6&quot; & class has the same name) it's kinda not rite..
then u shuld avoid of callin ANYthing by reserved words (u called ur script &quot;script.js&quot; try renamin it into &quot;scriipt.js&quot; or smth)
thats all for now; fix it & lemme kno if smth else workin wrong.. regards, vic