npsari Posted August 1, 2009 Share Posted August 1, 2009 Hello there, I have this simple Javascript which works great... <div id="container"> <div class="event"> <div class="eventtitle"> <p><a href="javascript://">OpenClose</a></p> </div> <div class="eventbody"> Content goes here. </div> </div> </div> <script type="text/javascript"> var wrap = document.getElementById('container'), divs = wrap.getElementsByTagName('div'); for (var i=0; i<divs.length; i++) if (/\beventtitle\b/gi.test(divs[i].className)) divs[i].getElementsByTagName('a')[0].onclick = showHide; function showHide() { var p = this.parentNode.parentNode, div = p.nextSibling; while (div.nodeType != 1) div = div.nextSibling; div.style.display = (div.style.display == 'none') ? 'block' : 'none'; } </script> The only problem is, when the page is loaded, the div area is already expanded. Can you please change my code so the div area will be collapsed by default? Thank you Quote Link to comment https://forums.phpfreaks.com/topic/168426-solved-expand-collapse-div/ Share on other sites More sharing options...
jug Posted August 1, 2009 Share Posted August 1, 2009 I wouldnt call that simple JavaScript. Here you go and ive made the script even simpler. Hope this helps <html> <head> <title>Show/Hide Element</title> <script type="text/javascript"> function showHide(div){ if(document.getElementById(div).style.display == 'none'){ document.getElementById(div).style.display = 'block'; }else{ document.getElementById(div).style.display = 'none'; } } </script> </head> <body> <p><a href="#" onclick="showHide('eventbody');">OpenClose</a></p> <div id="eventbody" style="display:none;">Content goes here.</div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/168426-solved-expand-collapse-div/#findComment-888549 Share on other sites More sharing options...
npsari Posted August 2, 2009 Author Share Posted August 2, 2009 wow , this is all I can say You are an expert friend Quote Link to comment https://forums.phpfreaks.com/topic/168426-solved-expand-collapse-div/#findComment-888624 Share on other sites More sharing options...
VigneshRohith Posted June 7, 2013 Share Posted June 7, 2013 This is simple but superb! Thanks I have one doubt: " How to refresh a dropdown(<select>) in php without refresh the whole page?" EG: I have my database values in dropdown list, When i insert a row in mysql database it should reflect on dropdown list without refreshing a whole page! Thanks in Advance! Quote Link to comment https://forums.phpfreaks.com/topic/168426-solved-expand-collapse-div/#findComment-1434610 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.