js+css幫同事寫的一個顯示消失過渡動畫,拿去吧,我無處安放的demo,存在csdn是個好辦法,點個贊

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
            crossorigin="anonymous"></script>
    </head>

    <body>
        <div class="content">
            1234
        </div>
    </body>

    <script type="text/javascript">
        //到頁面1秒後顯示
        $(function() {
            setTimeout(function() {
                $(".content").animate({
                    height: "30px"
                });
            }, 1000)

            //到頁面3秒後消失
            setTimeout(function() {
                $(".content").animate({
                    height: "0px"
                });
            }, 3000)
        })
    </script>

    <style>
        .content {
            background: #007DDB;
            height: 0px;
            overflow: hidden;
        }
    </style>
</html>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章