備忘録

webの備忘録のために

タブ

※ポイント
1.$("#ulTab li").index(this);で何番目のliを選択したかを値を取得する。
2.$(".dContent_wrap").eq(num).removeClass('disnon');で選択されたliだけ
display: none;がかけてあるクラスを削除
<script type="text/javascript">
$(function() {
	$("#ulTab li").click(function() {
		var num = $("#ulTab li").index(this);
		$(".dContent_wrap").addClass('disnon');
		$(".dContent_wrap").eq(num).removeClass('disnon');
		$("#ulTab li").removeClass('select');
		$(this).addClass('select');
		
		// 一回全部_dfにする
		$("#ulTab li").each(function() {
			$img = $(this).find("img");
			var src = $img.attr("src");
			var src_df = src.replace("_ac.gif", "_df.gif");
			$img.attr("src", src_df);
		});
		// 自分だけ_acにする
		$img = $(this).find("img");
		var src = $img.attr("src");
		var src_ac = src.replace("_df.gif", "_ac.gif");
		$img.attr("src", src_ac);
		
		
	});
});
</script>