Hello and Good Day<br />
<br />
is it possible to hide a <DIV> or <IFRAME>?<br />
I mean, when I click on a button, I want that my <DIV> hides himself and is not visible on the page. When I click again (or on another button) the <DIV> must appear again.<br />
<br />
Is that possible?<br />
<br />
It doesn't work with style.height = 0px, because if the <DIV> contains text or something, it automatically fits to that size. When you say style.overflow = 'hidden' it doesn't work.<br />
<br />
Can somebody help me?<br />
<br />
Thanks!!!<br />
<br />
JayDie<!--content-->function hide(el_id){<br />
<br />
var temp=document.getElementById(el_id).visibility;<br />
<br />
temp=(temp=='visible')?'hidden':'visible';<br />
<br />
}<br />
<br />
function remove(el_id){<br />
<br />
var temp=document.getElementById(el_id).display;<br />
<br />
temp=(temp=='block')?'none':'block';<br />
<br />
}<br />
<br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#" onclick="hide('the_div');return false;">Hide the div until this link is click again.</a><br />
<br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#" onclick="remove('the_div');return false;">Remove the div until this link is click again.</a><br />
<br />
There are two functions, hide and remove.<br />
<br />
Hide simply makes the div invisible but it will still occupy the same amout of space on the page. <br />
Remove basically does just that, it removes the div from the page by not displaying it, until the link is clicked again.<br />
<br />
For the remove function I have used display:none; and display:inline; If you want to use this for an iframe then you will need to change all instances of block to inline.<!--content-->hmmzzz... Are you sure?<br />
<br />
When I implement this, nothing happens... no error... no hiding...<br />
<br />
weird...<br />
<br />
JayDie<!--content-->Do you have an element with something in it and an id="the_div" because if you don't then that could explain it. Try also adding this to you code:<br />
<br />
<br />
<br />
<div id="the_div">Click a link to hide me!</div><!--content-->OK, after taking another look at my script I noticed a couple of errors. I've decided to uploaded a working modified version of the script.<br />
<br />
This one DOES work, the last one was not tested as I just wrote it on-the-fly.<!--content-->Yes, thank you. The 'remove' one was the one I needed. I allready got the 'hide' one, but that wasn't what I wanted!
<br />
<br />
Thank you!<br />
<br />
JayDie<!--content-->Happy to help.
<!--content-->using the example the previous user posted:<br />
<br />
Is there a way to have the I frame hidden on load, and then visible after clicking a link? if so, can you show me how?<!--content-->Sure, just put this right after the iframe:<script type="text/javascript"><!--<br />
document.getElementById("the_iframe").style.visibility="hidden";<br />
//--></script><!--content-->
<br />
is it possible to hide a <DIV> or <IFRAME>?<br />
I mean, when I click on a button, I want that my <DIV> hides himself and is not visible on the page. When I click again (or on another button) the <DIV> must appear again.<br />
<br />
Is that possible?<br />
<br />
It doesn't work with style.height = 0px, because if the <DIV> contains text or something, it automatically fits to that size. When you say style.overflow = 'hidden' it doesn't work.<br />
<br />
Can somebody help me?<br />
<br />
Thanks!!!<br />
<br />
JayDie<!--content-->function hide(el_id){<br />
<br />
var temp=document.getElementById(el_id).visibility;<br />
<br />
temp=(temp=='visible')?'hidden':'visible';<br />
<br />
}<br />
<br />
function remove(el_id){<br />
<br />
var temp=document.getElementById(el_id).display;<br />
<br />
temp=(temp=='block')?'none':'block';<br />
<br />
}<br />
<br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#" onclick="hide('the_div');return false;">Hide the div until this link is click again.</a><br />
<br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#" onclick="remove('the_div');return false;">Remove the div until this link is click again.</a><br />
<br />
There are two functions, hide and remove.<br />
<br />
Hide simply makes the div invisible but it will still occupy the same amout of space on the page. <br />
Remove basically does just that, it removes the div from the page by not displaying it, until the link is clicked again.<br />
<br />
For the remove function I have used display:none; and display:inline; If you want to use this for an iframe then you will need to change all instances of block to inline.<!--content-->hmmzzz... Are you sure?<br />
<br />
When I implement this, nothing happens... no error... no hiding...<br />
<br />
weird...<br />
<br />
JayDie<!--content-->Do you have an element with something in it and an id="the_div" because if you don't then that could explain it. Try also adding this to you code:<br />
<br />
<br />
<br />
<div id="the_div">Click a link to hide me!</div><!--content-->OK, after taking another look at my script I noticed a couple of errors. I've decided to uploaded a working modified version of the script.<br />
<br />
This one DOES work, the last one was not tested as I just wrote it on-the-fly.<!--content-->Yes, thank you. The 'remove' one was the one I needed. I allready got the 'hide' one, but that wasn't what I wanted!
<br /><br />
Thank you!<br />
<br />
JayDie<!--content-->Happy to help.
<!--content-->using the example the previous user posted:<br /><br />
Is there a way to have the I frame hidden on load, and then visible after clicking a link? if so, can you show me how?<!--content-->Sure, just put this right after the iframe:<script type="text/javascript"><!--<br />
document.getElementById("the_iframe").style.visibility="hidden";<br />
//--></script><!--content-->