用jQuery实现广告的定时弹窗

最新推荐文章于 2022-05-04 00:00:00 发布

余木尘

最新推荐文章于 2022-05-04 00:00:00 发布

阅读量567

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/weixin_45583017/article/details/100361823

版权

JavaScript 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

广告样式

	<script src="js/jquery-3.4.0.js"></script>
    <style>
        div{
            width: 500px;
            height: 500px;
            background-color: burlywood;
            display: none;  //页面默认不显示
            position: fixed;
            right: 10px;
            bottom: 10px;
        }
	</style>
    <body>
    <div></div>    //就一块简单的div
    </body>

jQuery代码

<script>
    $(function () {  
    //页面加载完成后4秒弹出，2秒显示时间，从第二次开始隔2秒弹出，仍然2秒显示
        setInterval(s, 4000);
       function s() {
           $("div").fadeIn();//淡入
           //$("div").slideDown();//滑入
           //$("div").show();//显示
           //$("div").css("display","block");
           //$("div")[0].style.display="block";
           setTimeout(nos, 2000);
       }
       function nos() {
           $("div").fadeOut();//淡出
           //$("div").slideUp();//滑出
           //$("div").hide();//隐藏
           //$("div")[0].style.display="none";
       }
    });
</script>

余木尘

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
用jQuery实现广告的定时弹窗

广告样式 <script src="js/jquery-3.4.0.js"></script> <style> div{ width: 500px; height: 500px; background-color: burlywood; di...
复制链接

扫一扫