FirefoxRocks 0 Report post Posted August 14, 2006 This is my first help post in this Java/JavaScript section. Can someone write/find me a piece of code that will hide <div> boxes? Preferred stuff: There is a bar that has the subtitle of the <div> box contents. A button on the right side of the bar shows and hides the div box. Contents are in a box with a border and slides in and out of the bar smoothly and relatively quickly. Box MUST be customizable using CSS internal/external stylesheets. Any help would be appreciated. All codes will be tested and best code be selected. Share this post Link to post Share on other sites
TypoMage 0 Report post Posted August 15, 2006 Hmm why don't you put your problem in the shoutbox. Someone will know about your problem. Sadly I do not know anything a about JavaScript. But that is all I got. Share this post Link to post Share on other sites
hype 0 Report post Posted August 16, 2006 I try creating the source code for you... I'll give it a shot, hope this what you're looking for...Preview : http://forums.xisto.com/no_longer_exists/ <html><head><title>Test</title><script type="text/javascript">function Show(num){ if (num == 1) { text1.style.display = "block"; text2.style.display = "none"; } else if (num == 2) { text1.style.display = "none"; text2.style.display = "block"; } }</script></head><body><div id="text1" style="display:none"><a href="java script:void(null)" onclick="Show(2)">Hide Text</a><br/>Text here...</div><div id="text2" style="display:block"><a href="java script:void(null)" onclick="Show(1)">Show Text</a></div></body></html> If you encounter any problems feel free to ask! Share this post Link to post Share on other sites
FirefoxRocks 0 Report post Posted August 16, 2006 That is sort of what I'm looking for.Could you make it so that the box can slide in and out of the "Text Here" thing? That would make it look neat and attractive.If noone else comes up with another code, I will use what's there. Share this post Link to post Share on other sites
hype 0 Report post Posted August 16, 2006 I dont exactly get what you mean... any examples or what? Is it like a table with border that disappear when you click the word hide? Sorry, my english isnt that good... Share this post Link to post Share on other sites
fffanatics 0 Report post Posted August 16, 2006 (edited) In order to make it look like it is sliding from the top of the screen out without using flash, you would have to write a javascript function that would change the the css top attribute from the same height as where the show text link is to that number plus the height of the new text incrementaly so that it looks like it slides. You also would need to set the divs position attribute to aboslute and define exactly where you want it to be on the page. For the functions you would do something like function slide (element, amount, initTop, finalTop) { if (initTop >= finalTop) { element.style.top = finalTop; break; } else { element.style.top = initTop + amount; slide (element, amount, initTop, finalTop); }} The only problem with the script above is that you are going to have to find a way to slow down the sliding using a pause script that also still flushes the screen. Try googling for a moving image script and just take the pause part of it. Currently im at work so i cant really spend that much time finding one. Atleast here is a start for you. Edited August 16, 2006 by fffanatics (see edit history) Share this post Link to post Share on other sites
FirefoxRocks 0 Report post Posted August 19, 2006 I try creating the source code for you... I'll give it a shot, hope this what you're looking for... Preview : http://forums.xisto.com/no_longer_exists/ <html><head><title>Test</title><script type="text/javascript">function Show(num){ if (num == 1) { text1.style.display = "block"; text2.style.display = "none"; } else if (num == 2) { text1.style.display = "none"; text2.style.display = "block"; } }</script></head><body><div id="text1" style="display:none"><a href="java script:void(null)" onclick="Show(2)">Hide Text</a><br/>Text here...</div><div id="text2" style="display:block"><a href="java script:void(null)" onclick="Show(1)">Show Text</a></div></body></html> If you encounter any problems feel free to ask! The selected option is that quoted post. Thank you for the code! I will implement it in plenty of my pages. Look for JavaScript help #2! You might get a chance to answer my question there. Share this post Link to post Share on other sites
serverph 0 Report post Posted August 19, 2006 problem resolved. closed as per thread starter's request. Share this post Link to post Share on other sites
iGuest 3 Report post Posted April 5, 2008 I want some javascript code. I.E.,when I click one radio button one form will be display.-reply by suhasini Share this post Link to post Share on other sites
