我们的官网,是游戏网站,需要很多的动画效果,下面就开写一个box有n个元素,这些元素顺序淡入,每隔2分钟,执行一次,代码开始:

    <div></div>
<div></div>
<div></div>
<div></div>
div{
width: 100px;height: 60px;background: green;
margin: 20px;float: left;display: none;
}
var o_div = $('div');
var len = o_div.length;
var count = 0;
function overturn(){
o_div.eq(count).fadeIn();
count ++;
if (count == len) {//当元素全部显示后
clearInterval(s);
setTimeout(function(){//过3分钟再重新执行
s = setInterval(overturn,800);//每0.8秒出现一个元素
},3000);
}
if (count > len) {
count = 0;
o_div.css('display','none');//当元素个数加到比元素本身个数大时,隐藏,为下一次动画做准备
}
}
var s = setInterval(overturn,800);  

好,这样,就实现了。

这里我要在说一点,时间延迟除了上面用到的setTimeout()之外,还有一个方法,是 .delay(time).hide(0),.delay函数是jquery 1.4.2新增的函数,.hide函数里必须放一个0,不然延时不起作用。

  

最新文章

  1. MVP社区巡讲-云端基础架构:12月5日北京站 12月12日上海站
  2. 设置arc 的默认编辑器
  3. javaweb回顾第五篇浅谈会话
  4. Qt Style Sheets Examples——定制前景色和背景色
  5. Cassandra 技术选型的问题
  6. 架构设计:负载均衡层设计方案(6)——Nginx + Keepalived构建高可用的负载层
  7. libvirt TLS
  8. 这样就算会了PHP么?-5
  9. 【NOIP2012】旅行计划
  10. erlang证书加密
  11. vue-cli项目在IE下运行钩子函数抛出异常“ReferenceError: “Promise”未定义&amp;quot;”的解决办法
  12. vb.net WIN32API 获取listview的值
  13. XML反序列化遇到数字型节点值为空导致反序列化异常
  14. OEMCC 13.2 安装部署
  15. 再谈kbmMW垃圾回收
  16. 安装postgis,使用postgis导入shapefile的步骤总结
  17. POJ 3164 Command Network(最小树形图模板题+详解)
  18. Modbus tcp 格式说明 通讯机制 附C#测试工具用于学习,测试
  19. 【C#】Event事件的订阅和发布
  20. Mybatis的关联映射

热门文章

  1. xmake新增对Qt编译环境支持
  2. [Python3] 002 Python3 中常用的命名规则
  3. Django @csrf_exempt不能在类视图中工作(Django @csrf_exempt not working in class View)
  4. HNUSTOJ-1698 送外卖(TSP问题 + 状态压缩DP)
  5. 【React -- 9/100】 抽离顶部导航栏 - [组件复用]
  6. 3.css3中多个背景图片的用法
  7. vue编写轮播图组件
  8. CPM、CPC、CPA、PFP、CPS、CPL、CPR等广告术语是什么意思
  9. linux Apache 日志轮询
  10. 洛谷P1879 [USACO06NOV]玉米田Corn Fields (状态压缩DP)