Pages

10.6.10

simple jquery slide toggle

if you don't have jquery, you have to download it from www.jquery.com if you wish to apply this short tutorial.
after download jquery simple include it in your page's head tag
<script src="jquery.js" type="text/javascript"></script>
now create any html element, I will create simple div
<div id="our_div" style="background:yellow;border:1px dotted black;">our div's content comes here</div>
and now I will create a link to hide and show "toggle" this div
<script>
$(document).ready(function() {
$("#toggle_link").click(function() {
$("#our_div").slideToggle();
});
});
</script>
<a style="cursor:pointer;" id="toggle_link">toggle my div</a>

example:
our div's content comes here

toggle my div

No comments: