博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js无限轮播的写法
阅读量:6348 次
发布时间:2019-06-22

本文共 851 字,大约阅读时间需要 2 分钟。

js实现轮播很简单,无限轮播也不是很难,掌握技巧就很简单了。

$(document).ready(function(){

  var x=0;
  var itime;
  var newshop=function(){
  if (x%3==1) {
    $('#shopDiv').animate({'margin-left':-1842.5},1500);
    clearTimeout(itime);
    itime=setTimeout(function(){newshop();x++;}, 6500);
  }else if(x%3==2){
    $('#shopDiv').animate({'margin-left':0},0);
    clearTimeout(itime);
    itime=setTimeout(function(){newshop();x++;}, 0);
  }else if(x%3==0){
    $('#shopDiv').animate({'margin-left':-922},1500);
    clearTimeout(itime);
  itime=setTimeout(function(){newshop();x++;}, 6500);
  }
}
itime=setTimeout(function(){newshop();x++;}, 5000);
$('#shopDiv').mouseover(function(){
clearTimeout(itime);
})
$('#shopDiv').mouseleave(function(){
clearTimeout(itime);
itime=setTimeout(function(){newshop();x++;}, 3000);
})
})

转载于:https://www.cnblogs.com/webwangjie/p/7403873.html

你可能感兴趣的文章
Kafka项目实战-用户日志上报实时统计之应用概述
查看>>
Android自定义Dialog(美化界面)
查看>>
SpriteBuilder中CCMotionStreak提示图片文件找不到
查看>>
抽象数据类型(ADT)入门(一)
查看>>
Reading List 2015-03
查看>>
Java并发结构
查看>>
深入理解Java内存模型(二)——重排序
查看>>
JBPM4.4(1)-简单工程的搭建
查看>>
插件化研究代Activity注册
查看>>
【SQL 学习】case 表达式
查看>>
数据库设计原则
查看>>
GCD
查看>>
minix2.0内核组织结构与公用头文件说明
查看>>
【AIX 命令学习】lscfg -l hdisk1 -v 查看 hdisk1系统配置
查看>>
我们也说说Android.mk(3) - 宏
查看>>
gnuradio的Python应用中绘图
查看>>
Web-Scale-IT 到底是啥?
查看>>
PostgreSQL数据库备份之pg_dump并行备份
查看>>
hdu 1028 Ignatius and the Princess III (母函数)
查看>>
android仿IOS7的两种对话框
查看>>