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 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> 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 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! Link to comment https://forums.phpfreaks.com/topic/168426-solved-expand-collapse-div/#findComment-1434610 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.