Last updated on September 20th, 2014 at 10:58 am

VN:F [1.9.22_1171]
Rating: 6.4/10 (43 votes cast)

This is a very simple tutorial on how to show and hide a division tag or Expand and collapse toggle div using simple jquery.

<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(){

$("#butShowHideSlow").click(function () {

$("#divShowHideSlow").toggle("slow");

});

});

</script>

<button id="butShowHideSlow">Click Me</button>

<div style="width:300px;height:47px; border: solid 1px black;background-color:white;text-align:center;" id="divShowHideSlow">Div that hide and show slowly</div>

Check out the DEMO here
Very Simple Right 🙂

VN:F [1.9.22_1171]
Rating: 6.4/10 (43 votes cast)

Leave a Reply

Your email address will not be published. Required fields are marked *