admin

hide and show div tag using jquery and javascript

first we are going to include jquery library for show and hide the div tag

[sourcecode language=”javascript”]
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
[/sourcecode]

we are going to show and hide the div tag using jquery function

[sourcecode language=”javascript”]
<script language="javascript">
$(document).ready(function() {
$("#showID").click(function() { $("#divMsg").show(1000);});
$("#hideID").click(function() { $("#divMsg").hide(1000);});
});
</script>
[/sourcecode]

creating two link to show and hide based on the link ids

[sourcecode language=”html”]
<div><a href="javascript:;" id="showID">Show</a> |
<a href="javascript:;" id="hideID">Hide</a></div>
[/sourcecode]

next we are going to create div tag which display show and hide the content from it

[sourcecode language=”html”]
<div id="divMsg">Your content will comes here…</div>
[/sourcecode]
Continue reading…