/ Published in: Other
Expand |
Embed | Plain Text
INSIDE THE HEAD ...................................................................... <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(function() { $("#trigger").click(function(event) { event.preventDefault(); $("#box").slideToggle(); }); $("#box a").click(function(event) { event.preventDefault(); $("#box").slideUp(); }); }); </script> HTML ...................................................................... <a href="#" id="trigger">TRIGGER</a> <div id="box"> <a href="#" class="close">[x]</a> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</p> </div> CSS ...................................................................... #box { display: none; }
Comments
Subscribe to comments
You need to login to post a comment.

This was exactly what I was looking for. Perfect!
Cool thing. What would I have to write, if I wanted the box to load collapsed?
Thanks this is great, Here is it without the "X" since I found that unnecessary
$(function() {
$("#trigger").click(function(event) { event.preventDefault(); $("#upload-box").slideToggle(); });
});
This was my html: TRIGGER