js 点击动画更改元素的高度和元素的文本内容

Posted 2020-10-04 理想程序员

动画效果兼容各大标准浏览器和 IE 5-11 版本

js 代码如下：

$(".tc>span>a").click(function () {
        if ($(this)[0].innerText == "更多课程>>"){
            $(".tc>div>ul").stop().delay(50).animate({height:1604},500);
            $(this)[0].innerText = "<<收起";
        }
        else {
            $(".tc>div>ul").stop().delay(50).animate({height:802},500);
            $(this)[0].innerText = "更多课程>>";
        }
        return false; // 阻止默认事件
    }); // 更多课程

html 代码结构如下：

<div class="tc mld">
        <h5><span>辅导班</span><small></small></h5>
        <div style="background:#c2c2c2">动画更改高度的div</div>
        <span><a href="#">更多课程>></a></span>
    </div>

O(∩_∩)O谢谢！！！