判断浏览当前页面倒计时几秒

最新推荐文章于 2023-08-15 14:32:00 发布

金翅

最新推荐文章于 2023-08-15 14:32:00 发布

阅读量128

点赞数

分类专栏： js+jq 文章标签： jquery javascript

本文链接：https://blog.csdn.net/qq_37103514/article/details/118215479

版权

js+jq 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>判断浏览当前页面倒计时几秒</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
    <script src="js/jquery-3.2.1.min.js"></script>
	<style>
        *{
            margin: 0;
            padding: 0;
        }
        .times{
            height: 2000px;
            text-align: center;
            line-height: 500px;
            font-size: 50px;
        }

	</style>
</head>
<body>
	<div class="times">
       8
    </div>
<script>
    $(function () {
        var timer = null;
        var num = 7;
        var _move = true;
        $(document).on('visibilitychange', function(e) {
            if (e.target.visibilityState === "visible") {
                _move = true;
                fn()

            } else if (e.target.visibilityState === "hidden") {
                clearInterval(timer);
            }
        });
        function fn() {
            $(window).scroll(function () {
                if (_move) {
                    _move = false;
                    timer=setInterval(function () {
                        if (num==0){
                            clearInterval(timer);
                        }else {
                            $('.times').html(num)
                            num--
                        }
                    },1000)
                }
            })
        }
        fn()
    })
</script>
</body>
</html>

金翅

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
判断浏览当前页面倒计时几秒

<!doctype html><html><head> <meta charset="utf-8"> <title>判断浏览当前页面倒计时几秒</title> <meta name="keywords" content=""> <meta name="description" content=""> <script src="js/jquery-3.2.1.min.js"><
复制链接

扫一扫

专栏目录