位置: 编程技术 - 正文

Javascript & DHTML 实例编程(教程)(四)初级实例篇2—动画

编辑:rootadmin
上篇说了动态创建结点和删除结点的例子,这一篇说一些如何用setInterval和setTimeout做简单的动画。 语法皆是window.setTimeout(fn, delay), window.setInterval(fn, delay) fn可以是一个函数名,也可以是一个执行的字符串,但要注意的是,如果fn是一个可以执行的字符串,且有参数,如window.setInterval("myFunction(obj)",)将可能抛出一个异常,这个时候,通常是你要传递一个对象参数,我建议用这样的一个办法来解决,也建议使用这种方法来使用window.setTimeout和window.setInterval: window.setInterval(function (){ myFunction(obj);},); 还有一种情况就是在一个"class"里,即要执行this.myFunction(obj)如何实现呢? function jsclass() {}; jsclass.prototype.init = function (obj) { var self = this; //创建一个this指针的引用 window.setInterval(function(obj) { self.myFunction(obj);},); }; jsclass.prototype.myFunction = function (obj) { //TODO }; DHTML的全局方法setInterval和setTimeout,所谓全局,即在window层,不属于DHTML的DOM元素的方法里,这两个有一些区别,网上也有很多说明,也就是setInterval是循环执行一个指定函数,setTimeout是只执行一次。例外说明一点,属于window层次的,可以在前面不加window,即可以用window.setInterval也可以直接用setInterval。 它们都返回一个数字型的timerId,用于cleaverInterval/clearTimeout方法,从setInterval/setTimeout中返回。如果做过桌面应用的朋友,可以把这个setInterval和setTimeout假想成创建一个线程,而timerId则是一个线程Id,而cleaverInterval/clearTimeout方法则是消毁这个线程。也许这样可以更好的理解这两个方法。 (在具体的应用中,我更驱向于用setTimeout。) 知道这两个方法的功能,先来写一个简单的例子: 一个一秒后弹出的alert对话框。 <script> window.setTimeout(function () { alert("timeout example after 1 second"); },) </script> 每一秒创建一个新DIV结点的函数 <script> function intervalExample() { var div=document.createElement("div"); div.innerHTML = "tutorial of DHTML and javascript programming, by www.never-online.net"; document.body.appendChild(div); } window.setInterval(intervalExample,); </script> 而实际应用中,setTimeout可以有一个另类一些的应用,比如相当于VB中的DoEvents函数,或者.net桌面程序中Application.DoEvents();这样的功能,也就是异步处理,因为DHTML没有多线程,所以说这个功能在很多的时候是为了给用户觉得不是在假死状态,或者给其它的程序按照代码的逻辑继续执行下去而不会阻塞或者也不会跳过一段代码执行。 举个例子。 下段代码是没有加setTimeout的。运行后,锚点会马上指向hash2 <script> window.location.hash="hash1"; window.location.hash="hash2"; </script> 这一段是加了setTimeout的,锚点会在3秒后指向hash1,再在3秒后指向hash2 <script> var doEventsDelay = 0; function DoEvents (fn) { window.setTimeout(fn,doEventsDelay); doEventsDelay+=; } DoEvents(function () { window.location.hash="hash1"; doEventsDelay-=; } ); DoEvents(function () { window.location.hash="hash2"; doEventsDelay-=; } ); </script> 下面我们做一个实用些的例子,比如一个动态显示tip的动态菜单。 一、这里只讲解setTimeout的方法,setInterval的请看demo里的代码,还要注明一点(本例中有一个比较严重的问题是没有解决的,这一问题我将留到以后再讲解)是关于坐标的。比如将下面代码中的sliderShow放到一个table中,就可能会发现一些问题了。:D 思路,得到一个元素,相对这个元素的作标,再根据一个tip的容器从而做一个动画, 主要用到的就是相对元素的X,Y坐标,关于坐标的一些属性意义,参见下图: 而整个动画的思路,见下图注释代码: Slider Show Demo - Slider Show Demo click show setTimeout demo sliderShowtutorial of DHTML and javascript programmingby never-online, never-online.net [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]是否觉得上面的例子很多都是重复的劳动?如果减少一些岂不更好?:D,的确如此,上面的JS代码有近一半都是重复的,在这里我就不把它优化了,还是留给大家做一些实质性的工作,减少上面代码的冗余。

推荐整理分享Javascript & DHTML 实例编程(教程)(四)初级实例篇2—动画,希望有所帮助,仅作参考,欢迎阅读内容。

Javascript & DHTML 实例编程(教程)(四)初级实例篇2—动画

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

javascript中的几个运算符 ||是这样运算的:从第一个开始,遇到有意义的返回,否则返回最后一个表达式(注意不一定是Boolean值);&&是这样运算的:从第一个开始,遇到无意

你需要知道的JavsScript可以做什么? JavsScript可以做什么?JavaScript可以做客户端的数据验证、处理,同服务器进行数据交互(AJAX),界面功能增强、美化等等,似乎JavaScript就只能做页面或

javascript之函数直接量(function(){})() 种语法是什么意思(function(){})()如下例:scriptlanguage="JavaScript"(function(){document.write("somescriptcode");})()/scriptscriptlanguage="JScript"type="Text/JScript"!--vara=(function(s){r

标签: Javascript & DHTML 实例编程(教程)(四)初级实例篇2—动画

本文链接地址:https://www.jiuchutong.com/biancheng/383961.html 转载请保留说明!

上一篇:Javascript & DHTML 实例编程(教程)(三)初级实例篇1—上传文件控件实例

下一篇:javascript中的几个运算符(javascript有几种类型)

  • 发票能减多少税
  • 固定资产怎么确定是否减值
  • 工资可以先计提不发吗
  • 发票开票地址是注册地址还是经营地址
  • 计提代扣代缴个人缴纳的社会保险费分录
  • 固定资产停止使用转入更新改造的会计处理
  • 个人股权转让协议书范本合同
  • 销售货物的运费增值税计入什么科目
  • 个人独资企业个人所得税核定征收
  • 非公益性捐赠支出是永久性差异吗
  • 出口发票税率为0还能退税吗
  • 2月的发票入在1月可以吗
  • 营改增后增加了什么征税项目
  • 营改增后建筑业开票规定
  • 科技型中小企业享受优惠税收政策2023
  • 食堂费用计入应付职工薪酬吗
  • 财务保证金怎么做分录
  • 无人机开票税收编码是多少
  • 月收入不超10万减免 具体分销售额吗
  • 开票退回怎么做账
  • 上月暂估本月怎么冲销
  • 金蝶标准版年末已经结账如果重新结账
  • 稿费个人所得税计算方式
  • 出口退税过期了怎么办理
  • linux help
  • 个体户能给自己交五险吗
  • 如何在vue项目中导入外部的包
  • 高新企业认定条件2019
  • nwtray.exe - nwtray是什么进程 作用是什么
  • PHP:Memcached::add()的用法_Memcached类
  • php api
  • 自定义修改器
  • ecap.exe是什么意思
  • thinkphp分页传递参数
  • 房产开发企业涉及税种
  • 港口机场铁路
  • 回迁房办理房产证契税怎么交
  • 收到提供劳务的收入
  • 带你看看房间英语怎么写
  • 亏损企业所得税怎么交
  • 专票抵扣联可以盖两个章吗
  • 【深度学习】AI一键换天
  • 关于酒店采购
  • 矿产资源补偿费计入税金及附加吗
  • 个体工商户超过100万怎么缴税
  • 转出未交增值税借方余额表示什么
  • 垫付应收款怎么做会计分录
  • 清算汇缴报表填写范本
  • mysql优化常用的几种方法
  • 保险公司委托代征是什么意思
  • 怎么结转未交增值税
  • 金税三期个税申报
  • 自产货物赠送客户账务处理
  • 企业转让固定资产企业所得税
  • 上期留抵税额可以留多久
  • 长期应收款是否计提坏账准备
  • 应收款挂账是什么意思
  • 盘古pg插件
  • win10如何彻底清理
  • ubuntu下mysql的常用命令
  • windows远程桌面连接怎么用
  • win7系统检测不到u盘
  • Win10 Mobile 10586正式版即将向Insider用户推送
  • Extjs TimeField 显示正常时间格式的代码
  • 从《AndEngine游戏开发实践指南》开始,学习AndEngine引擎
  • bat关闭bat
  • nodejs与springboot结合
  • dos常用命令与批处理文件
  • js的异步事件循环机制
  • 深入理解新发展理念
  • unity c++ dll
  • 面向对象的程序设计语言是
  • 增值税的进项税额转出是什么意思
  • 银饰品交消费税吗
  • 工会春游费用怎么报销
  • 国家税务总局河北地税局
  • 郑州市区税务局
  • 提高税务管理水平,降低税务风险
  • 金三系统企业所得税如何变更所得税缴纳方式?
  • 苏30参数
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设