justAnoob Posted January 9, 2010 Share Posted January 9, 2010 I have a js function that slides open a div when an image is clicked. When the page loads, the div is already open. How would I have the div closed when the page loads. Somehow run the script on page load so the div is closed ? Tried it, cannot get it to work. Any ideas? Quote Link to comment Share on other sites More sharing options...
trq Posted January 9, 2010 Share Posted January 9, 2010 Hide it using css (visibity:none) then un-hide it within your function. Quote Link to comment Share on other sites More sharing options...
justAnoob Posted January 9, 2010 Author Share Posted January 9, 2010 If I do that, it will just appear when the function is called. I would like it to slide open instead of just appearing. Quote Link to comment Share on other sites More sharing options...
trq Posted January 9, 2010 Share Posted January 9, 2010 You going to need top post some code. Quote Link to comment Share on other sites More sharing options...
chaiwei Posted January 9, 2010 Share Posted January 9, 2010 Assume the function that you have is called openDiv(), then if You got jquery then you use document.ready function, $(document).ready(function(){ openDiv(); }); But if you didn't use jquery, try <body onload="openDiv()"> <div id="close" onclick="openDiv()" style="display:none"></div> Quote Link to comment Share on other sites More sharing options...
justAnoob Posted January 9, 2010 Author Share Posted January 9, 2010 Lets say, I have a picture of an 'x' when the 'x' is clicked on, a div is displayed(sliding open) that works, but I would like the div closed on page load, so when the user clicks on the x, the div slides open <div style="position:relative; width:240px; height:200px; margin-bottom:5px;"> <div style="position:absolute; width:18px; height:32px; right:162px; top:-7px; background-color:#9AA4AD; text-align:center; cursor:pointer; padding:0px;" onclick="Slide();" > <table width="100%" height="32px" cellspacing="0" cellpadding="0"> <tr> <td align="center" valign="middle" style="text-size:9pt;"> <img src="images/K_little.png" width="29" border="0" height="32" /></td> </tr> </table> </div> <div id="exampleSlider" style="position:absolute; top:36px; left:0px; width:240px; height:200px; background-color:#9AA4AD; overflow:hidden;"> <table width="100%" height="100%"> <tr> <td valign="top" style="padding:3px;"> <textarea name="message_2_user" cols="23" rows="8" style="overflow:auto; border:thin #000"> </textarea> <br /> <br /> <?php if( (!isset($_SESSION['auth'])) || (!isset($_SESSION['id'])) ) { echo 'Please log in to send messages.'; } else { echo '<input type="submit" name="submit" id="submit" value="Send Message" />'; } ?> </td> </tr> </table> </div> Click the to send a message. </div> Quote Link to comment Share on other sites More sharing options...
justAnoob Posted January 9, 2010 Author Share Posted January 9, 2010 I kinda got it. window.onload=Slide(); but when the page loads up, it shows the div sliding up to the closed position. I guess that is good enough for now. Thanks for all the input. 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.