.hide() .hide( duration, [callback] ) .hide( [duration,] [easing,] [callback] )
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("p").hide(); $("a").click(function ( event ) { event.preventDefault(); $(this).hide(); }); }); </script> </head> <body> <p>Hello</p> <a href="#">Click to hide me too</a> <p>Here is another paragraph</p> </body> </html>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> p { background:#dad; font-weight:bold; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function () { $("p").hide("slow"); }); }); </script> </head> <body> <button>Hide 'em</button> <p>Hiya</p> <p>Such interesting text, eh?</p> </body> </html>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> span { background:#def3ca; padding:3px; float:left; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#hidr").click(function () { $("span:last-child").hide("fast", function () { // use callee so don't have to name the function $(this).prev().hide("fast", arguments.callee); }); }); $("#showr").click(function () { $("span").show(2000); }); }); </script> </head> <body> <button id="hidr">Hide</button> <button id="showr">Show</button> <div> <span>Once</span> <span>upon</span> <span>a</span> <span>time</span> <span>there</span> <span>were</span> <span>three</span> <span>programmers...</span> </div> </body> </html>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> div { background:#ece023; width:30px; height:40px; margin:2px; float:left; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ for (var i = 0; i < 5; i++) { $("<div>").appendTo(document.body); } $("div").click(function () { $(this).hide(2000, function () { $(this).remove(); }); }); }); </script> </head> <body> <div></div> </body> </html>
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท