extended text help needed

[abemaca]

first ide like to say sorry if i posted this in the wrong place.

 

<SCRIPT language="JavaScript">
<!--
function showLayer(name) {
name.style.visibility = "visible";
}

function hideLayer(name) {
name.style.visibility = "hidden";
}
// -->
</SCRIPT>

Example click <span onclick="showLayer(thisone)" style="cursor:hand"><b>here</b></span><br>
<DIV id="thisone" style="position: top:100; left:10; absolute; visibility:hidden">Some text or other stuff
<br><a href="#null" style="cursor:hand" style="text-decoration:none;" onclick="hideLayer(thisone)">[ hide ]</a>
</DIV>
<p>

Example click <span onclick="showLayer(1thisone)" style="cursor:hand"><b>here</b></span><br>
<DIV id="1thisone" style="position: absolute; visibility:hidden">Some text or other stuff
<br><a href="#null" style="cursor:hand" style="text-decoration:none;" onclick="hideLayer(1thisone)">[ hide ]</a>
</DIV>
<p>

 

this is my code that works fine. my issue is i want to click it and the hidden text then pushes the text below already on show down the page , if you run the code above youll see the 1st hidden message opens over the top of the next line down where as i want it to push the text below it.

 

hope i make sense lol

[sunfighter]

When use use the visibility style element you take up the space that the div would have even if it is hidden.

Use display="none"; This gives up that space, but grabs it and pushes other elements down when it is revealed with display: block;

 

[abemaca]

thanks for the reply .......... but if i add display then it doesn't work

 

could you write the code as you mean please , sorry to be a pain.

[sunfighter]

simple substitution:

<script type="text/javascript">
function showLayer(name)
{
name.style.display = "block";
}

function hideLayer(name)
{
name.style.display = "none";
}
</script>

Example click <span onclick="showLayer(thisone)" style="cursor:hand"><b>here</b></span><br>
<div id="thisone" style="position: top:100; left:10; absolute;display:none;">
Some text or other stuff
<br>
<a href="#null" style="cursor:hand" style="text-decoration:none;" onclick="hideLayer(thisone)">[ hide ]
</a>
</div>
<p>

Example click <span onclick="showLayer(sone)" style="cursor:hand"><b>here</b></span><br>
<div id="sone" style="position: absolute; display:none;">Some text or other stuff
<br><a href="#null" style="cursor:hand" style="text-decoration:none;" onclick="hideLayer(sone)">[ hide ]</a>
</div>
<p>

[abemaca]

thanks alot mate you have been a big help.

 

i was adding it to the DIV section , not in the script 

 

thanks again for your time.