关闭时如何制作动画?[Javascript]

How To Make Animate When Closed?[Javascript]

本文关键字:Javascript 动画 何制作      更新时间:2023-09-26

JavaScript Here

<script>
    function toggle2(showHideDiv, switchTextDiv) {
        var ele = document.getElementById(showHideDiv);
        var text = document.getElementById(switchTextDiv);
        $(ele).slideToggle();
        if(ele.style.display == "block") {
            ele.style.display = 'none';
        } else {
            ele.style.display = 'block';
        }
    }
</script>

和 HTML

<a id="myHeader" href="javascript:toggle2('myContent','myHeader');" >
    <img   src="gcont/images/cloud/folder.png" alt="" height="30" width="30"/>
    General
</a>
</div>
<div style="clear:both;"></div>
<div id="contentDiv">
    <div id="myContent" style="display: none;">
        <a href="http://1drv.ms/1ZN0HuD" target="_blank">____Test Sub Article</a></br>
        <a href="http://1drv.ms/1PiCKtz" target="_blank">____Green Line Stock</a>
    </div>
</div>

有机会使关闭顺利吗?Cuz Close仍然是错误不是动画。谢谢

无需设置display样式,slideToggle()会处理它

function toggle2(showHideDiv, switchTextDiv) {
  $('#' + showHideDiv).slideToggle();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <a id="myHeader" href="javascript:toggle2('myContent','myHeader');">
    <img src="gcont/images/cloud/folder.png" alt="" height="30" width="30" />General</a>
</div>
<div style="clear:both;"></div>
<div id="contentDiv">
  <div id="myContent" style="display: none;">
    <a href="http://1drv.ms/1ZN0HuD" target="_blank">____Test Sub Article</a>
    <br/>
    <a href="http://1drv.ms/1PiCKtz" target="_blank">____Green Line Stock</a>
  </div>
</div>