本节内容:

jquery插件jTimer,jQuery定时器。

需求:

按时间间隔执行一个任务,当满足一定条件时停止执行。

1,插件用法:

复制代码 代码示例:

(function ($) {

$.extend({

timer: function (action,context,time) {

var _timer;

if ($.isFunction(action)) {

(function () {

_timer = setInterval(function () {

if (!action(context)) {

clearInterval(_timer);

}

}, time);

})();

}

}

});

})(jQuery);

2,调用示例

复制代码 代码示例:

画布-jTimer插件示例-www.jbxue.com

#wrap

{

display: table;

margin: 0 auto;

}

#cvs

{

display: table-cell;

vertical-align: middle;

}

function drawRound(context) {

if (context.counterclockwise) {

draw(context.x, context.y, context.r, context.start, context.start - Math.PI / 50, context.counterclockwise);

context.start -= Math.PI / 50;

return context.start > 0.5 * Math.PI;

}

else {

draw(context.x, context.y, context.r, context.start, context.start + Math.PI / 50, context.counterclockwise);

context.start += Math.PI / 50;

return context.start < Math.PI;

}

}

function draw(x, y, r, sAngle, eAngle, counterclockwise) {

var cvs = document.getElementById("cvs");

ctx = cvs.getContext("2d");

ctx.strokeStyle = "#f00";

ctx.beginPath();

ctx.arc(x, y, r, sAngle, eAngle, counterclockwise);

ctx.stroke();

}

$(function () {

$.timer(drawRound, { x: 100, y: 100, r: 50, start: 1.5 * Math.PI, counterclockwise: true }, 200);

$.timer(drawRound, { x: 100, y: 100, r: 60, start: 0, counterclockwise: false }, 200);

});

html使用定时器timer,jquery插件jTimer jquery定时器的用法举例相关推荐

  1. 开发一款自动指向特定页面元素的jQuery插件:jQuery PointPoint

    来源:tutorialzine.com          编译:GBin1.com web设计人员感觉目前他们出于一个两难的境地:他们需要创建出优美的用户界面,需要创新并且实用.有时候,尽管我们全力付 ...

  2. jquery插件 (jquery之家)的使用案列,(瀑布流的使用)非常简单

    在我们使用这个插件的时候,我们只需要打开这个网址 ,非常优秀的一个jquery插件库jQuery库_jQuery之家-自由分享jQuery.html5.css3的插件库 使用这个插件库 1.先引入js ...

  3. 自己开发开源jquery插件--给jquery.treeview加上checkbox

    很多时候需要把树状的数据显示除来,比如分类,中国省份.城市信息,等,因此这方面的javascript插件也有很多.比如性能优异的jquery.treeview和国人开发的功能强大的zTree. 我最近 ...

  4. ASP.NETmvc常用JQUERY插件【jquery.dataTables.js】

    离开WEBFORM 也就离开了大量的前端困境,刚一开始用MVC,真感觉好像在沙漠中行走,很想念以前的控件,都快想死了,很快发现原来JQUERY 有很多插件可以用,只怪自己平时不收集,用的时候才手忙脚乱 ...

  5. 生成二维码的 jQuery 插件:jquery.qrcode.js

    jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery 插件,它使用非常简单,生成的 QRcode 无需下载图片,并且不依赖第三方服务,比如最近 Google 服务在国 ...

  6. Jquery - jquery 插件,jQuery.Switchable

      jquery 插件,最近新发现的jQuery.Switchabl,集多种样式,感觉蛮好用的,发上来和大家分享一下. 以下为这个插件能实现的样式和功能. http://www.jqueryajax. ...

  7. jQuary总结11:jQuery插件封装---jQuery封装 手风琴 动画插件

    完整代码下载点击我的GitHub: https://github.com/XingJYGo/jquery-accordion 1 手风琴的效果展示如下: 2 封装插件目录结构如下: 主要包括:HTML ...

  8. 我写的第一个jquery插件:jquery.photoFrame(version 0.2)

    先看效果 introduce     jQuery photoframe plugin     A useful plugin to beautify image or text by wrappin ...

  9. 自己在项目中写的一个Jquery插件和Jquery tab 功能

    后台查询结果 PDFSearchResult实体类: [DataContract(Name = "PDFSearchResult")]public class PDFSearchR ...

最新文章

  1. 基于锚框与无需锚框的通用物体检测算法
  2. STL priority实例
  3. 关于使用旋转四元数绕轴旋转θ角度时,使用参数是θ/2的理解
  4. 尹成python爬虫百度云_Python爬虫实战:抓取并保存百度云资源
  5. 如何优雅地处理 EF Core 异常
  6. Java AIO 编程
  7. linux c libcurl的简单使用
  8. python读取二进制数据转整形,在python中读取二进制数据(替换C代码)
  9. .net core 应用程序“default web site”中的服务器错误_Net程序员讲JAVA系列——Spring Boot“科普篇”...
  10. 『科学计算_理论』矩阵求导
  11. Git 基础之远程仓库-2.5
  12. 前端项目运行以后端口不是常见的8080等端口,端口数很大,不在配置的端口跑项目
  13. 实战:Longhorn存储-2022.2.24
  14. 点与直线位置关系,叉乘
  15. 若依 / RuoYi-Vue 前后端分离,前端部署及注意事项
  16. Allegro怎样导出Flotherm文件
  17. 2022起重机械指挥考试模拟100题及答案
  18. FusionConpute虚拟机的发放与管理
  19. Google | Google Kubernetes Engine 集群实战
  20. 快速查询的秘籍 —— B+ 树索引

热门文章

  1. 20.【Axure 10 】菜单-账号
  2. 电影《闻香识女人》部分对白
  3. 论文阅读方法(整理自公众号)
  4. python编程从入门到实践,第七章练习题
  5. Android Camera开发系列:预览镜头缩放(数码变焦)
  6. 司铭宇讲师:销售技巧培训之大客户关系管理
  7. 一文彻底弄懂大端与小端
  8. SpringBoot 2.7.2 分模块整合 activiti 7.1.0.M6
  9. Javaweb项目读取本地图片通过虚拟路径
  10. sustech solidowrks