jQuery show()とhide()の例
jQueryのshow()とhide()が最もよく使用されるエフェクトです。
-
show() – 一致する要素を表示します.
-
hide() – 一致する要素を非表示にします.
どちらの方法も、パラメータとしてのサポート時間(slow、fast、またはexact milliseconds)です。このパラメーターを省略すると、デフォルトの400ミリ秒が適用されます。
自分で試してみてください
<html> <head> <script type="text/javascript" src="jquery-1.4.2.min.js"></script> <style type="text/css"> p{ padding:8px; margin:16px; border:1px solid blue; width:250px; height:50px; background-color:#999999; color:white; } </style> </head> <body> <h1>jQuery show() and hide() example</h1> <p>Hello, this show() and hide() example</p> <button id=show>show()</button> <button id=hide>hide()</button> <button id=reset>Reset</button> <script type="text/javascript"> $("#show").click(function () { $("p").show('fast'); }); $("#hide").click(function () { $("p").hide(1000); }); $("#reset").click(function(){ location.reload(); }); </script> </body> </html>