|
|
2009.12.28——一个jquery的选项卡
先看html代码
<body><div class="tab"><div class="tab_menu"><ul><li class="selected"><span>xhtml</span></li><li><span>css</span></li><li><span>javascript</span></li></ul></div><div class="tab_box"><div>xhtml</div><div>css</div><div>javascript</div></div></div></body>
jquery代码
<script type="text/javascript">$(function(){var tab_menu_li = $('.tab_menu li');$('.tab_box div:gt(0)').hide();tab_menu_li.mouseover(function(){$(this).addClass('selected') .siblings().removeClass('selected');var index = tab_menu_li.index(this);//用于同步$('.tab_box div').eq(index).show() .siblings().hide();}).hover(function(){$(this).addClass('hover');},function(){$(this).removeClass('hover');});});</script>
css代码
.selected{ background:#fc0;}.hover{ background:#f60; color:white;}不做过多说明了 看一下应该就懂了 |
|
京ICP备14020293号-2
本网站内容均收集于互联网，如有问题请联系QQ:389897944予以删除
窥视卡
雷达卡
楼主
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡