:hidden 不可視な要素 display:none

今度は、displayがnoneな要素を試します。

下記の「click!」というボタンをクリックしてみてください。

display:none;



ソースは次の通りです。ボタンをクリックすると、 ID名が「#my1」要素内にあるvisibility:hidden;の要素に色など指定して.fadeIn()でフェイドイン表示(可視化)します。
<div id="my1">
  <div style="display:none;">display:none;</div>
  <button id="btn1">click!</button>
</div>

<script type="text/javascript">
jQuery(function($){
  $("#btn1").click(function(){
    $(":hidden","#my1")
        .html("こんにちは")
        .css("width","300px")
        .css("padding","12px")
        .css("background-color","gold")
        .fadeIn();
  })
});
</script>
次ページでは、 input要素のhiddenタイプ を試します。