zoukankan      html  css  js  c++  java
  • jq tab图片切换

    <div class="wrapper">
    <ul class="tab">
    <li class="tab-item active">国际大牌<span>◆</span></li>
    <li class="tab-item">国妆名牌<span>◆</span></li>
    <li class="tab-item">清洁用品<span>◆</span></li>
    <li class="tab-item">男士精品</li>
    </ul>
    <div class="products">
    <div class="main selected">
    <a href="###"><img src="imgs/guojidapai.jpg" alt=""/></a>
    </div>
    <div class="main">
    <a href="###"><img src="imgs/guozhuangmingpin.jpg" alt=""/></a>
    </div>
    <div class="main">
    <a href="###"><img src="imgs/qingjieyongpin.jpg" alt=""/></a>
    </div>
    <div class="main">
    <a href="###"><img src="imgs/nanshijingpin.jpg" alt=""/></a>
    </div>
    </div>
    </div>
    <script src="jquery-1.12.4.js"></script>
    <script>
    $(function () {
    $(".tab-item").mouseenter(function () {
    $(this).addClass("active").siblings().removeClass("active");
    var idx=$(this).index();
    $(".main").eq(idx).addClass("selected").siblings().removeClass("selected");
    });
    });
    </script>
  • 相关阅读:
    Linq To Sql 大全
    lambda表达式学习
    一步一步学Linq to sql系列文章
    MVC 学习
    Guava环境设置
    ANT简介
    Quartz特点
    XStream环境设置
    log4j配置
    类是什么?
  • 原文地址:https://www.cnblogs.com/lujieting/p/10099476.html
Copyright © 2011-2022 走看看