Sunday, 11 August 2013
Hide or Visible Div tag on button click
Full code:
<html>
<head>
<title>jQuery Hide and show div content</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
</head>
<body>
<p><h1>Dreamthewebs.blogspot.com</h1></p>
<div id="slide" style="width:250px; height:50px; background-color:Olive; color:White; font-size:large">
Click Click show and hide button<br />
dreamthewbs.blogspot.com
</div>
<br />
<button id="hide"> Hide</button>
<button id="show">Show </button>
<script>
$(document).ready(function()
{
$("#hide").click(function()
{
//code for show
$("#slide").hide();
});
//code for show
$("#show").click(function()
{
$("#slide").show();
});
});
</script>
</body>
</html>
Demo
<html>
<head>
<title>jQuery Hide and show div content</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
</head>
<body>
<p><h1>Dreamthewebs.blogspot.com</h1></p>
<div id="slide" style="width:250px; height:50px; background-color:Olive; color:White; font-size:large">
Click Click show and hide button<br />
dreamthewbs.blogspot.com
</div>
<br />
<button id="hide"> Hide</button>
<button id="show">Show </button>
<script>
$(document).ready(function()
{
$("#hide").click(function()
{
//code for show
$("#slide").hide();
});
//code for show
$("#show").click(function()
{
$("#slide").show();
});
});
</script>
</body>
</html>
Demo
0 comments:
Post a Comment