S
Stewart
Hi
I am using latest versions of Firebox and Safari.
Why are style properties on Divs (and perhaps other objects) initially set
to null? For the style.* properties to have any effect, I have to set them
manually.
Below is the code listing at the end of the post.
In this example, style.visibility is initially null.. why is it not set to
'visible'?
Likewise the first time the doStuff() function is executed,
alert ( document.getElementById('win').style.top );
-> returns nothing.
Why don't the style properties get populated when the page is loaded?
Thanks.
Stewart
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<LINK REL=StyleSheet HREF="default.css" TYPE="text/css" />
<body>
<script>
function doStuff(button)
{
visible = document.getElementById('win').style.visibility;
if ( visible == 'visible')
{
visible = "hidden";
}
else
{
visible ="visible";
}
document.getElementById('win').style.visibility = visible;
alert ( document.getElementById('win').style.top );
document.getElementById('win').style.top = '40px';
}
</script>
<form>
<div id = 'test'>
<input id = "button" type="button" onclick="doStuff(this)" value="Done"/>
</div>
</form>
<div id="win" class="windowTest">
<table width="20%" id="table">
<tr>
<td>
Stewart Hector
</td>
</tr>
<table>
</span>
</body>
</html>
----- CSS ----------
.windowTest
{
display:block;
background: #FFFFCC;
width:40%;
border-width:2px;
border-color:#00FFFF;
border-style : groove;
top:30%;
position: relative;
left: 10%;
visibility:visible;
}
I am using latest versions of Firebox and Safari.
Why are style properties on Divs (and perhaps other objects) initially set
to null? For the style.* properties to have any effect, I have to set them
manually.
Below is the code listing at the end of the post.
In this example, style.visibility is initially null.. why is it not set to
'visible'?
Likewise the first time the doStuff() function is executed,
alert ( document.getElementById('win').style.top );
-> returns nothing.
Why don't the style properties get populated when the page is loaded?
Thanks.
Stewart
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<LINK REL=StyleSheet HREF="default.css" TYPE="text/css" />
<body>
<script>
function doStuff(button)
{
visible = document.getElementById('win').style.visibility;
if ( visible == 'visible')
{
visible = "hidden";
}
else
{
visible ="visible";
}
document.getElementById('win').style.visibility = visible;
alert ( document.getElementById('win').style.top );
document.getElementById('win').style.top = '40px';
}
</script>
<form>
<div id = 'test'>
<input id = "button" type="button" onclick="doStuff(this)" value="Done"/>
</div>
</form>
<div id="win" class="windowTest">
<table width="20%" id="table">
<tr>
<td>
Stewart Hector
</td>
</tr>
<table>
</span>
</body>
</html>
----- CSS ----------
.windowTest
{
display:block;
background: #FFFFCC;
width:40%;
border-width:2px;
border-color:#00FFFF;
border-style : groove;
top:30%;
position: relative;
left: 10%;
visibility:visible;
}