网站进行了升级,有所变化,请使用 搜索 查找更多内容

网站制作超简洁jquery标签切换代码

潍坊华邦网络 2016-01-12 17:06:38 4.9K 0


自己整理的超简洁Jquery标签切换代码,在网站制作过程中会经常用到,喜欢的收藏一下


<script type="text/javascript"> 

function chgTab(c,a,s){

//函数参数说明 c 容器名称 a 容器中点击标签所在的位置 s 焦点样式名称

$(a).click(function(){
var i=$(this).index();
$(c).children("ul").hide();
$(c).children("ul").eq(i).fadeIn();
$(a).removeClass();
$(a).eq(i).addClass(s);
})
}

</script>



使用:


    <div class="iBox">
      <h4><a  href="javascript:void(0);"  class="tabOn">网站公告</a> <a  href="javascript:void(0);">书法资讯</a> <a  href="javascript:void(0);">学习心得</a></h4>
          <ul style="display:block;"><% call getInfo(19,6,18) %></ul>
          <ul><% call getInfo(20,6,18) %></ul>
          <ul><% call getInfo(21,6,18) %></ul>
    </div>

<script type="text/javascript">
chgTab(".iBox",".iBox h4 a","tabOn")
</script>


评论留言

管理员已经关闭评论
×

扫码登录网站