{js} :visibleの挙動、slideUpの挙動を検証。

slideUp()前後のdisplay:;プロパティの変わり方。:visibleの使い方の確認。
$(window)をクリックで関数実行。:visibleで要素をカウントする。

スライドダウンの挙動テスト。

スライドダウンの挙動テスト。

スライドダウンの挙動テスト。

display:;

:visibleの個数:;

<script>
$(function(){

	$("#Disp01").html($(".hogeSlideDown").css("display"));
	$("#Disp02").html($(".hogeSlideDown:visible").size());
			
	$(window).click(function(){
		$(".hogeSlideDown").slideDown("slow",function(){
			$("#Disp01").html($(".hogeSlideDown").css("display"));
			$("#Disp02").html($(".hogeSlideDown:visible").size());
		})//end
	})//end click func
})

</script>

<style>
.hogeSlideDown { display:none; background:#ffcc00; float:left; margin:0 10px 0 0; height:50px; width:120px;}
p.show { display:block;}
.cl {clear:both;}
</style>
<p class="hogeSlideDown show">スライドダウンの挙動テスト。</p>
<p class="hogeSlideDown">スライドダウンの挙動テスト。</p>
<p class="hogeSlideDown">スライドダウンの挙動テスト。</p>


<p class="cl">display:<span id="Disp01"></span>;</p>
<p class="cl">:visibleの個数:<span id="Disp02"></span>;</p>

カテゴリ:

トラックバック(0)

トラックバックURL: http://www.0yen-coding.com/mt-tb.cgi/273

コメントする

あわせて読みたいブログパーツ