$(document).ready(function () { $("#buttonHide").click(function () { $("#form").hide(); }); $("#buttonShowNormal").click(function () { $("#form").show(); }); $("#buttonShowAnimation").click(function () { $("#form").show("slow", function () { alert("Show Animated !!"); }); }); });
<html> <head> <title>show in jQuery</title> </head> <body> <fieldset id="form"> <legend>Form</legend> <table> <tr> <td><label>Name:</label></td> <td><input type="text" id="txtName"><td> </tr> <tr> <td><label>Age:</label></td> <td><input type="text" id="txtAge"><td> </tr> <tr> <td><label>Address:</label></td> <td><input type="text" id="txtAddress"><td> </tr> </table> </fieldset> <div id="buttonDiv"> <input type="button" id="buttonHide" value="Hide"/> <input type="button" id="buttonShowNormal" value="Show Normal"/> <input type="button" id="buttonShowAnimation" value="Show Animation"/> </div> </body> </html>
fieldset { width:300px; margin-left:100px; } #buttonDiv { margin-left:100px; }