zoukankan      html  css  js  c++  java
  • jquery之toggleClass应用

    今天记载一下常用的html + css + jquery效果应用

    1.html内容

    <div class="selBtn screen_btn">
    <a id="project1" data-type="1" class="active">筹备期项目</a>
    <a id="project2" data-type="2">运营期项目</a>
    </div>

    2.css内容:

    .selBtn a{ 50%; float: left; text-align: center; box-sizing: border-box; border: solid 0.03125rem #999999; line-height: 1.8125rem;}
    .selBtn a.act{background: #ff9600; color: #ffffff; border: solid 0.03125rem #ff9600;}

    3.jquery内容

    $(function() {
    //筛选选择效果
    $('.screen_btn a').click(function(){
      $(this).toggleClass("active").siblings().removeClass("active");
      })
    });

    注意siblings方法只用作用于同一层级的元素。

  • 相关阅读:
    数据结构笔记(一)
    Distance dependent Chinese Restaurant Processes
    距离依赖中餐馆过程
    AOP技术-02
    AOP技术-01
    Oracle-06
    web-02-css01
    web-02-css
    web-01
    jQuery对ajax的支持
  • 原文地址:https://www.cnblogs.com/michaelShao/p/5542401.html
Copyright © 2011-2022 走看看