PDA

View Full Version : Positioning

gselvara
08-27-2002, 04:43 AM
Hi,
Please copy and paste the bellow code to a browser. When the page loads if you click the "showPos" button it will show 'Left:0' as the left position of the text box. But actually the left is 120. But if you click the "changeLoc" button and then click the "showLoc" button it will corectly show Left:200. Please help me out here. I dont know why this error is comming. Is it a bug in IE ?

Thanks,
Gavin

<!-- This code works only on IE5.5 -->
<!-- S T A R T -->
<HTML>
<HEAD>
<style>
<!--
.drag{position:relative;cursor:hand; left:120px; top:120px}
-->
</style>
<TITLE></TITLE>

<SCRIPT LANGUAGE=javascript>
<!--
function showPos(){
//alert( window.text1.style.left );
alert( 'Left : ' + window.text1.style.posLeft );
}

function changeLoc(){
window.text1.style.posLeft = 200;
}

//-->
</SCRIPT>

</HEAD>
<BODY>

<INPUT type="text" id=text1 name=text1 class="drag">

<INPUT type="button" value="showPos" id=button1 name=button1 onclick="showPos()">
<INPUT type="button" value="changeLoc" id=button2 name=button2 onclick="changeLoc()">
</BODY>
</HTML>

<!-- E N D -->
Mr J
08-27-2002, 08:15 PM
The attributes are "on the fly" and not "embedded"

<HTML>
<HEAD>
<style>
<!--
.drag{position:relative;cursor:hand; left:120px; top:120px}
-->
</style>
<TITLE></TITLE>

<SCRIPT LANGUAGE=javascript>
<!--
function showPos(){
//alert( window.text1.style.left );
alert( 'Left : ' + window.text1.style.posLeft );

}

function changeLoc(){
window.text1.style.posLeft = 200;
}

//-->
</SCRIPT>

</HEAD>
<BODY>

<INPUT type="text" name=text1 style="position:absolute;cursor:hand; left:120; top:120">

<INPUT type="button" value="showPos" id=button1 name=button1 onclick="showPos()">
<INPUT type="button" value="changeLoc" id=button2 name=button2 onclick="changeLoc()">
</BODY>
</HTML>
gselvara
08-28-2002, 04:17 AM
Thanks, yes that works.... But can you tell me why I need to put the style in the tag and not in a css ???? What I need to to do is to create a CSS.


Rgds,
Gavin
Zvona
08-28-2002, 02:49 PM
Just refreshing your memory about compliancies :D..

<style>
<!--
.drag{position:relative;cursor:pointer;left:120px; top:120px}
-->
</style>
Mr J
08-28-2002, 02:58 PM
Not too sure if I can explain properly but...

When you embed you do not create a layer although you do assign attributes to that class name.

Including the style attributes in a tag creates a layer....


I think........................

Maybe someone else can explain it better?





And Zvona........

Gavin wanted "HAND" not "POINTER"