js 自动播放的实例代码


Posted in Javascript onNovember 19, 2013
<!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>

定义播放时间,可以定义事件
Javascript 相关文章推荐
js中eval()函数和trim()去掉字符串左右空格应用
Feb 02 Javascript
javascript实现全角半角检测的方法
Jul 23 Javascript
jquery实现右侧栏菜单选择操作
Mar 04 Javascript
JS实现的幻灯片切换显示效果
Sep 07 Javascript
NODE.JS跨域问题的完美解决方案
Oct 20 Javascript
Validform表单验证总结篇
Oct 31 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(二)
May 11 Javascript
详解angular笔记路由之angular-router
Sep 12 Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
Nov 30 Javascript
解决layui的radio属性或别的属性没显示出来的问题
Sep 26 Javascript
three.js 制作动态二维码的示例代码
Jul 31 Javascript
JavaScript实现随机点名小程序
Oct 29 Javascript
鼠标滚轴控制文本框值的JS代码
Nov 19 #Javascript
jquery交替变换颜色的三种方法 实例代码
Nov 19 #Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
Nov 19 #Javascript
详解jQuery插件开发中的extend方法
Nov 19 #Javascript
Js 导出table内容到Excel的简单实例
Nov 19 #Javascript
js文本框输入点回车触发确定兼容IE、FF等
Nov 19 #Javascript
jquery.autocomplete修改实现键盘上下键自动填充示例
Nov 19 #Javascript
You might like
PHP中一个控制字符串输出的函数
2006/10/09 PHP
php+jQuery.uploadify实现文件上传教程
2014/12/26 PHP
php自定义函数实现二维数组排序功能
2016/07/20 PHP
PHP中的访问修饰符简单比较
2019/02/02 PHP
phpinfo的知识点总结
2019/10/10 PHP
jquery 日期分离成年月日的代码
2010/05/14 Javascript
浅谈Nodejs观察者模式
2015/10/13 NodeJs
分享一些常用的jQuery动画事件和动画函数
2015/11/27 Javascript
Angularjs中如何使用filterFilter函数过滤
2016/02/06 Javascript
在AngularJS中使用jQuery的zTree插件的方法
2016/04/21 Javascript
jquery实现简单Tab切换菜单效果
2020/07/17 Javascript
js利用正则表达式检验输入内容是否为网址
2016/07/05 Javascript
JS控制div跳转到指定的位置的几种解决方案总结
2016/11/05 Javascript
javascript ES6中箭头函数注意细节小结
2017/02/17 Javascript
gulp教程_从入门到项目中快速上手使用方法
2017/09/14 Javascript
JavaScript原生实现观察者模式的示例
2017/12/15 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
2017/12/19 Javascript
jQuery实现遍历XML节点和属性的方法示例
2018/04/29 jQuery
vue计算属性computed、事件、监听器watch的使用讲解
2019/01/21 Javascript
layui 实现table翻页滚动条位置保持不变的例子
2019/09/05 Javascript
详解vue中v-bind:style效果的自定义指令
2020/01/21 Javascript
JS+CSS实现炫酷光感效果
2020/09/05 Javascript
使用python编写android截屏脚本双击运行即可
2014/07/21 Python
json跨域调用python的方法详解
2017/01/11 Python
python实时分析日志的一个小脚本分享
2017/05/07 Python
Python实现PS滤镜中马赛克效果示例
2018/01/20 Python
python读取和保存视频文件
2018/04/16 Python
解决python大批量读写.doc文件的问题
2018/05/08 Python
PyQt5 窗口切换与自定义对话框的实例
2019/06/20 Python
使用python动态生成波形曲线的实现
2019/12/04 Python
python破解同事的压缩包密码
2020/10/14 Python
使用Python获取爱奇艺电视剧弹幕数据的示例代码
2021/01/12 Python
八一建军节部队活动方案
2014/02/04 职场文书
中学优秀班主任事迹材料
2014/05/01 职场文书
企业趣味活动方案
2014/08/21 职场文书
MySQL中几种插入和批量语句实例详解
2021/09/14 MySQL