• jquery set用法切换效果


    <div class="qie">   <!---切换容器-->
                <div class="tit"><!---切换标题-->
                    <h3 onMouseOver="set('qie',1,5)" id="qie1" class="hover">标题1</h3>
                    <h3 onMouseOver="set('qie',2,5)" id="qie2">标题2</h3>
                    <h3 onMouseOver="set('qie',3,5)" id="qie3">标题3</h3>
                    <h3 onMouseOver="set('qie',4,5)" id="qie4">标题4</h3>
                    <h3 onMouseOver="set('qie',5,5)" id="qie5">标题5</h3>
                
                </div>
                <div class="cont"><!---切换内容-->
                     <ul>
                             <li id="conqie1">111111111111111111111111</li>
                            <li id="conqie2" style="display:none;">222222222222222222222222</li>
                            <li id="conqie3" style="display:none;">333333333333333333333333</li>
                            <li id="conqie4" style="display:none;">444444444444444444444444</li>
                            <li id="conqie5" style="display:none;">555555555555555555555555</li>
                     
                     
                     </ul>
                
                </div>
    </div>
    <script>
       function set(name,cursel,n){
           for(i=1;i<=n;i++){
               var menu=document.getElementById(name+i);
           var con=document.getElementById("con"+name+i);
           menu.className=i==cursel?"hover":"";
           con.style.display=i==cursel?"block":"none"
           }
           }

    </script>
  • 相关阅读:
    HDU
    【JZOJ1252】【洛谷P5194】天平【搜索】
    【JZOJ1252】【洛谷P5194】天平【搜索】
    【JZOJ3896】战争游戏【割点】
    【JZOJ3896】战争游戏【割点】
    【JZOJ3895】数字对【ST表】
    【JZOJ3895】数字对【ST表】
    【JZOJ3894】改造二叉树【树】【LIS】
    【JZOJ3894】改造二叉树【树】【LIS】
    【洛谷P4014】【网络流24题】分配问题【费用流】
  • 原文地址:https://www.cnblogs.com/gerry/p/7124822.html
Copyright © 2020-2023  润新知