zoukankan      html  css  js  c++  java
  • jquery +点击按钮,切换div内容,按钮加高亮

    html:

    <div class="dw4">
    <span class="dw">单位(次)</span>
    <div class="time4">
    <div class="dat day active4">a</div>
    <div class="dat month">b</div>
    </div>
    </div>

    <div class="tabinners4">
    <div class="inner4">
        我是第一个内容哦
    </div>

    <div class="inner4">
    我是第二个内容呀

    </div>

    </div>

    css:

    .dw4{
    position: relative;
    }
    .time4{
    position: absolute;
    right:6px;
    top:2px;
    }
    .time4 .dat{
    55px;
    height: 20px;
    display: inline-block;
    /* float: right; */
    color: #fff;
    font-size: 12px;
    background: url(../image/l4.png) no-repeat;
    padding-left: 11px;
    padding-top: 1px;
    cursor: pointer;
    }

    .dw4 .active4{

    background: url(../image/h4.png) no-repeat;
    cursor: pointer;
    55px;
    }
    .tabinners4 .inner4:first-child{
    display: block;
    }

    .inner4{
    370px;
    height: 209px;
    background: url(../image/kuang4aa.png) no-repeat;
    position: relative;
    display: none;
    margin-top: 12px;
    }

    js:

    $(".time4 .dat").click(function(){
    $(this).addClass('active4').siblings().removeClass('active4');
    var index=$(this).index();
    $(".tabinners4 .inner4").eq(index).show().siblings().hide();
    })

  • 相关阅读:
    JDBC第一部分
    java mysql学习第三部分
    java mysql 第六部分
    java mysql学习第五部分
    java mysql学习第二部分
    java mysql学习第一部分
    元注解
    改良之前写的模拟栈代码
    java中如何自定义异常
    java中的语法规则
  • 原文地址:https://www.cnblogs.com/snowbxb/p/11513121.html
Copyright © 2011-2022 走看看