当前位置：网站首页>Div Click to collapse

Div Click to collapse

2022-04-21 07:53:00 【Gentleness901】 

<script type="text/javascript">
    function showdiv(){
        document.getElementById("hpn").style.display="block";
        document.getElementById("strHref").innerHTML=" Retract -";
        document.getElementById("strHref").href="javascript:hidediv()";
    }
    function hidediv(){
        document.getElementById("hpn").style.display="none";
        document.getElementById("strHref").innerHTML=" More options +";
        document.getElementById("strHref").href="javascript:showdiv()";
    }
    </script>
</head>
<body>
    <div id="pn">
        <p> Mobile product screening </p>
        <p> The Internet ： Move   Unicom   telecom </p>
        <div id="hpn" style="display:none">
            <p> Price ：5000 above  4000-4999 3000-3999</p>
            <p> characteristic ：JDPhone plan ‘0’ Yuan for the machine   water </p>
        </div>
    </div>
    <p class="slide">
        <a href="javascript:showdiv();" id="strHref" class="btn-slide"> More options +</a>
    </p>
</body>
</html>

div The slide show

<script type="text/javascript">
        $(document).ready(function(){
           $(".menuTitle").toggle(function(){
             $(this).next(".paddingTop").animate({height: 'toggle', opacity: 'toggle'}, "slow");
           },function(){
               $(this).next(".paddingTop").animate({height: 'toggle', opacity: 'toggle'});
           });
        });
</script>

  among div The content of , The default setting is hidden display:none;

                          <div class="menuTitle" id="twoid">
                                Position
                            </div>
                            <div class="borderTop marginTop paddingTop ">
                                Recruitment department ： The Marketing Department
                              <div>
                                <p>
                                    <strong> Responsibilities ： <br> </strong>1、 Collect market information . Through online and other media channels , Collect industry information
                                </p>
                              </div>
                            </div>

版权声明
本文为[Gentleness901]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/04/202204210629483326.html

边栏推荐

猜你喜欢

随机推荐