justAnoob Posted November 14, 2009 Share Posted November 14, 2009 I found this script online for hiding the divs. function closeall() { var divs=document.getElementsByTagName('div') for(var i=0; i<divs.length; i++) divs[i].style.display='none'; } What I'm looking to do is tweak it a bit so it doesn't close all the divs, actually not a div at all, a table with the id of "second". Could this function be modified a little or should I start over with a new function? Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted November 14, 2009 Share Posted November 14, 2009 I found this script online for hiding the divs. function closeall() { var divs=document.getElementsByTagName('div') for(var i=0; i<divs.length; i++) divs[i].style.display='none'; } What I'm looking to do is tweak it a bit so it doesn't close all the divs, actually not a div at all, a table with the id of "second". Could this function be modified a little or should I start over with a new function? function closeTable(id) { var oTable = document.getElementById(id); oTable.style.display = 'none'; } Quote Link to comment Share on other sites More sharing options...
justAnoob Posted November 15, 2009 Author Share Posted November 15, 2009 function closeTable(second) { var oTable = document.getElementById(second); oTable.style.display = 'none'; } <body onload ="closeTable(second)"> Nothing happens. Am i doing something wrong with the id of the table? Quote Link to comment Share on other sites More sharing options...
justAnoob Posted November 15, 2009 Author Share Posted November 15, 2009 this may be easier. here is the click function that opens and closes my menu options function clicked(element) { var div=document.getElementById(element) if(div.style.display=='none') div.style.display='block'; else div.style.display='none'; return; } When the page loads, all the menu options are expanded. Then when clicked upon they will close, so couldn't i just use a few lines of the function above to create a new function that keeps the menu closed on page load? Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted November 15, 2009 Share Posted November 15, 2009 Instead of using JavaScript to make something 'closed' when the page loads, use CSS and set its display to 'none.' Then, have a JavaScript function tied to some sort of event elsewhere on the page (a button's onclick event, for example) toggle that table's display. Something like: <!DOCTYPE html> <html> <head> <title>Blah</title> <style> #second { display: none; } </style> </head> <body> <table id="second"> <!-- table data --> </table> <button id="toggle">Click to toggle the display of the second table</button> </body> <script type="text/javascript"> var oButton = document.getElementById('toggle'); var oTable = document.getElementById('second'); oButton.onclick = function() { oTable.style.display = (oTable.style.display == 'none') ? '' : 'none'; } </script> </html> If you still insist on tying the JavaScript to the elements directly inside the HTML (which I do not recommend, but that's not really the topic here), then be sure to put quotes around the id you pass into the function. Quote Link to comment 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.