zoukankan      html  css  js  c++  java
  • 点击显示或隐藏,添加类名或删除类名

        <div class="bzlist">
      
             <div class="bz_01"></div>
             <div class="bz_02">
                  如何计算的金额?
                  <div class="bz_block">根据已知量算出未知量;运算根据已知量算出未知量;运算根据已知量;运算根据已知量算出未知量;</div>
             </div>
             
        </div>
    
    .bzlist{ background:#FFF; clear:both;}
    .bz_01{ float:left; 15%;}
    .bz_01 p{ background:url(../images/bz/ico5.png) no-repeat; 0.45rem; height:0.41rem; background-size:0.45rem 0.41rem; margin:0 auto; text-align:center; color:#FFF; font-size:0.22rem; line-height:0.36rem;height:0.99rem; margin-top:0.3rem;}
    .bz_02{ float:right; 96%; border-bottom:1px #dedede solid; line-height:0.99rem; font-size:0.24rem; font-size:#333; position:relative; text-indent:0.1rem; cursor:pointer;}
    .bz_02s{ border:none;}
    .bz_02:after{background:url(../images/bz/ico7.png) no-repeat; 0.22rem; height:0.12rem; background-size:0.22rem 0.12rem; display:block; content:""; position:absolute; right:0.2rem; top:0.46rem;}
    .bz_02_s:after{background:url(../images/bz/ico8.png) no-repeat; 0.22rem; height:0.12rem; background-size:0.22rem 0.12rem; display:block; content:""; position:absolute; right:0.2rem; top:0.46rem;}
    
    .bz_block{ clear:both; font-size:0.22rem; font-size:#666; line-height:0.4rem; text-indent:0; padding:0.1rem; display:none;}
    
    
    
    
    
    
    
    <script src="http://m.hcgroup.com/cn/js/jquery-1.10.2.min.js"></script>
    <script>
            
     $(".bz_02").click(function () {
             $(this).children().toggle(100);
             $(this).toggleClass("bz_02_s");
      });
    
     </script>
  • 相关阅读:
    winfrom 对话框
    容器控件
    简单记事本整理
    公共控件
    winfrom。布局
    ado 小测试
    ado.not--更改精简练习
    ado.not--数据库防字符串注入攻击学习及 练习
    ado.not--练习题
    ado.not--添加练习题
  • 原文地址:https://www.cnblogs.com/su1637/p/12895745.html
Copyright © 2011-2022 走看看