ktsirig Posted February 10, 2011 Share Posted February 10, 2011 Hello all! I have 2 things that I want to show/hide using JS. <html> <head> <title>Hidden Div</title> <script language="JavaScript"> function showstuff(boxid){ document.getElementById(boxid).style.visibility="visible"; } function hidestuff(boxid){ document.getElementById(boxid).style.visibility="hidden"; }</script> </head> <body> <a href="#" onclick="showstuff('one'); hidestuff('two');">Show ONE</a> <a href="#" onclick="showstuff('two'); hidestuff('one');">Show TWO</a> <div id="one" style="display:none" >ONE.</div> <div id="two" style="display:none">TWO.</div> </body> </html> If I use it as it is I don't see anything! If I don't use style="display:none" inside the divs, I see them both initially and I can hide/show each one depending on which link I press. But the thing is that I need both divs to be hidden in the first place, and when I click on ONE, to show TWO, when I click on TWO to hide ONE and show TWO etc. Each time 1 div should be visible, depending on which link we press. The other must disappear. Link to comment https://forums.phpfreaks.com/topic/227288-showhide-divs-simultaneously/ Share on other sites More sharing options...
iPixel Posted February 10, 2011 Share Posted February 10, 2011 what you need to do is create the 2 divs with display: none; then use javascript and say document.getElementById("idname").style.display = 'block'; Link to comment https://forums.phpfreaks.com/topic/227288-showhide-divs-simultaneously/#findComment-1172400 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.