js 自动播放的实例代码

前端技术 2023/09/02 JavaScript

复制代码 代码如下:

<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"
\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html>
<head>
<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\" />
<title>auto play</title>
<script type=\"text/javascript\" src=\"../jquery-1.8.0.min.js\" /></script>
<script type=\"text/javascript\">
    //数组的第一项为时长，其他项可自定义
    data = [[\"3\",\"a\"],[\"2\",\"b\"],[\"3\",\"c\"],[\"2\",\"d\"],[\"1\",\"\"]];

    $(document).ready(function(){
        //设置触发事件
        autoPlay.run = function(obj,num){
            back(obj,num);
        };
        autoPlay();
    });

    function back(obj,num){
        $(\"#div_show\").html(obj[num][1]);
    }

    function autoPlay(){
        //初始化计数参数
        if(autoPlay.num ==undefined)
            autoPlay.num = 0;
        //初始化时间点
        if(autoPlay.timepoint ==undefined)
            autoPlay.timepoint = new Date().getTime();
        if(autoPlay.num<data.length){
            //函数句柄，data 数组，autoPlay.num当前下标
            autoPlay.run(data,autoPlay.num);
            //按照元素时间长度播放数组
            if(new Date().getTime()>autoPlay.timepoint){
                //判断是否为第一次执行
                if(autoPlay.first==undefined)
                    autoPlay.first = true;
                else
                    autoPlay.num++;
                //设置下一次播放的时间点
                autoPlay.timepoint += (data[autoPlay.num][0]*1000);
            }
            setTimeout(\"autoPlay()\",500);
        }
    }

    $.extend({autoPlay:function(){
        var defaults = {inteval:500};
    }});

</script>
</head>
<body>
<div id=\"div_show\"></div>
</body>
</html>

本文地址：https://www.stayed.cn/item/5007

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案