右下角的弹出广告(slideDown+slideUp+fadeIn+fadeOut)

<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        .ad {
            position: fixed;
            right: 0;
            bottom: 0;
            width: 230px;
            height: 120px;
            background-image: url(imgs/ad.jpg);
            display: none;
        }

        .ad span {
            position: absolute;
            right: 0;
            top: 0;
            width: 40px;
            height: 18px;
            background-image: url(imgs/h.jpg);
            cursor: pointer;
        }
    </style>
    <script src="../jquery-1.11.1.js"></script>
    <script>
        $(function () {
            //需求:然广告ad部分,先滑入,在滑出,在淡入。然后绑定事件,点击span弹出
            //步骤:
            $(".ad").slideDown(1000).slideUp(1000).fadeIn(1000).children("span").click(function () {
                $(this).parent().fadeOut(1000);
            });

//            $(".ad").slideDown(1000, function () {
//                $(".ad").slideUp(1000, function () {
//                    $(".ad").fadeIn(1000, function () {
//                        $(".ad").children("span").click(function () {
//                            $(this).parent().fadeOut(1000, function () {
//                                alert("执行完毕!");
//                            });
//                        });
//                    });
//                });
//            })
        })
    </script>
</head>

<body>

    <div class="ani">我是内容</div>
    <div class="ad">
        <span></span>
    </div>

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容