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 相关文章推荐
javascript 中对象的继承〔转贴〕
Jan 22 Javascript
(转载)JavaScript中匿名函数,函数直接量和闭包
May 08 Javascript
用jscript实现新建word文档
Jun 15 Javascript
javascript数字数组去重复项的实现代码
Dec 30 Javascript
基于jquery的二级联动菜单实现代码
Apr 25 Javascript
js写的评论分页(还不错)
Dec 23 Javascript
jquery引用方法时传递参数原理分析
Oct 13 Javascript
原生js和jQuery随意改变div属性style的名称和值
Oct 22 Javascript
分享十五款 jQuery 社交网络分享插件
May 16 Javascript
使用canvas及js简单生成验证码方法
Apr 02 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
Aug 09 Javascript
select自定义小三角样式代码(实用总结)
Aug 18 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中HTML标签过滤技巧
2014/01/07 PHP
页面利用渐进式JPEG来提升用户体验度
2014/12/01 PHP
Yii数据模型中rules类验证器用法分析
2016/07/15 PHP
laravel通过a标签从视图向控制器实现传值
2019/10/15 PHP
php使用pthreads v3多线程实现抓取新浪新闻信息操作示例
2020/02/21 PHP
Laravel6.18.19如何优雅的切换发件账户
2020/06/14 PHP
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
鼠标经过tr时,改变tr当前背景颜色
2014/01/13 Javascript
JavaScript基本数据类型及值类型和引用类型
2015/08/25 Javascript
基于RequireJS和JQuery的模块化编程日常问题解析
2016/04/14 Javascript
jQuery继承extend用法详解
2016/10/10 Javascript
Vue.js第二天学习笔记(vue-router)
2016/12/01 Javascript
Angular CLI 安装和使用教程
2017/09/13 Javascript
node通过npm写一个cli命令行工具
2017/10/12 Javascript
vue axios 在页面切换时中断请求方法 ajax
2018/03/05 Javascript
vue2.0 computed 计算list循环后累加值的实例
2018/03/07 Javascript
封装一下vue中的axios示例代码详解
2020/02/16 Javascript
详解ES6 中的Object.assign()的用法实例代码
2021/01/11 Javascript
利用python获得时间的实例说明
2013/03/25 Python
Python学习笔记之视频人脸检测识别实例教程
2019/03/06 Python
使用Python给头像戴上圣诞帽的图像操作过程解析
2019/09/20 Python
Python ORM框架Peewee用法详解
2020/04/29 Python
Python 如何反方向迭代一个序列
2020/07/28 Python
利用CSS3的checked伪类实现OL的隐藏显示的方法
2010/12/18 HTML / CSS
CSS3的常见transformation图形变化用法小结
2016/05/13 HTML / CSS
英国乡村时尚和宠物用品专家:Pet & Country
2018/07/02 全球购物
Myprotein荷兰官网:欧洲第一运动营养品牌
2020/07/11 全球购物
Java模拟试题
2014/11/10 面试题
行政前台岗位职责
2013/12/04 职场文书
建筑工程管理专业自荐信范文
2013/12/28 职场文书
中秋节国旗下演讲稿
2014/09/05 职场文书
民主评议政风行风整改方案
2014/09/17 职场文书
2014年教研室工作总结
2014/12/06 职场文书
收入证明范本
2015/06/12 职场文书
2016思想纪律作风整顿心得体会
2016/01/23 职场文书
浅谈MySql整型索引和字符串索引失效或隐式转换问题
2021/11/20 MySQL