课程笔记
课程/JavaScript/前端开发
焦点图轮播特效
介绍
章节
问答
笔记
weixin_慕移动4288594
2020-05-11
setTimeout()的用法。
0赞 · 0采集
new_study
2018-05-13
设置定时器,清除定时器
0赞 · 0采集
天上的云再飘
2017-08-19
图片轮播
0赞 · 0采集
慕粉2332018849
2017-04-23
定时器设置与清除
截图
0赞 · 1采集
慕UI6939182
2017-02-27
//定时器 var timer; function play() { timer=setInterval(function(){next.onclick();},3000) } function stop() { clearInterval(timer); }
0赞 · 0采集
努力奋斗的小青年呀
2017-02-14
为什么我的最小化之后再打开,会非常快速的播放
截图
0赞 · 0采集
慕粉1474836
2017-01-24
轮播图
截图
0赞 · 0采集
小文_0005
2017-01-08
<h3>1 基本原理</h3> DOM结构: <div id="banner"> <div id="imgbox"></div> <div id="btnbox"></div> <button id="prev"></button> <button id="next"></button> </div> 分析: banner 有个主要的属性 overflow:hidden 无限滚动: 也叫无缝滚动。如果有5张图片,当图片轮播到第5张时,下一张轮播将是第1张。 实现方式、原理: 使用首尾辅助图。 如果有3张图,那么结构是这样的:3、1、2、3、1 假设现在轮播图的位置是第4张,也就是图片3, 点击下一张时,轮播的图片是应该是图片1,此时其实我们让其显示第5张,也就是图片1的辅助图。 如果有动画,当动画完成后停止在第5张图片1的辅助图上时,立刻把显示位置定位到第2张真正的图片1. <h3>2 dom和css</h3> <h3>3 箭头切换</h3> 把js写在dom后面或 window.onload=function(){} 中,以保证所需元素加载后再执行。 点击右 next 箭头时, imglist 向左移,也就是 left 值减少,我们才能看到下一张图片。 点击左 prev 箭头时,left需要加。 ...完整版找我咯,这里只能发1000字,还有完整细致的代码注释、分析^_^没办法,我是小白。 box.onmouseover=function(){stop()} box.onmouseout=function(){play()} function show_btn(){ for(var i=0;i<btnlist.length;i++){ //btnlist[i].className=''; //这样写虽然代码少但是遍及多 if(btnlist[i].className=='cur'){ btnlist[i].className=''; break; } } btnlist[index-1].className='cur'; //为什么要 index-1 ,因为一开始设置的 index 是1 }
0赞 · 0采集
勇闯极限
2016-11-27
getAttribute()dom二级得到元素的属性,可以得到自定义元素的属性。
1赞 · 0采集
Pei英2
2016-11-18
箭头切换就是要用定时器去设置的,才能有这个效果
0赞 · 0采集
Pei英2
2016-11-18
next.onclick()
0赞 · 0采集
云彩无色3804005
2016-11-13
从箭头切换->无限滚动->按钮切换->延迟切换->自动播放,一会要写下代码操作下,代码量不少啊,要操作啊
1赞 · 2采集
慕慕8663590
2016-09-14
clearInterval可以清楚定时器
0赞 · 0采集
谢大西瓜
2016-08-28
这是一种回调函数的使用方式,如果stop(),这是stop方法就被执行了,但是如果写方法名stop,是事件触发时才会调用stop方法
0赞 · 0采集
谢大西瓜
2016-08-28
存在一个bug,就是如果鼠标不移进去不会开始轮播的。在onload里面也要加上paly();
0赞 · 0采集
丨朵粑粑花
2016-04-08
自动播放: ①鼠标移开时自动播放,鼠标移上去时停止,也是通过定时器来实现的 ②设置定时器,让它隔几秒切换一次,相当于3秒钟调一次next.onclick(右箭头)事件,鼠标移开时清除定时器 ③自动切换需要写两个函数来控制自动切换,声明一个变量来存放定时器不给任何值 ④给变量一个setInterval,并传入一个函数让它执行右箭头的点击事件,再给一个时间间隔 ⑤创建一个函数清除定时器,clearsetInterval(定时器名称) ⑥鼠标移开时定时器执行,移上时清除定时器执行,要给整个容器加一个鼠标移入移开事件 ⑦鼠标不做任何事情时让它自动播放,调用函数
0赞 · 0采集
林暮轩雨
2015-12-25
setInterval()定时器函数
0赞 · 0采集
慕粉_荣耀
2015-06-29
setTimeout(动作,间隔时间) 该函数的动作只能执行一次 setInterval(动作,间隔时间) 该函数运行多次 setInterval(function(){}, 300); 简单函数可以在定义时直接传入 function(){} 定义函数 clearInterval 清除定时器 onmouseover 鼠标移上 onmouseout 鼠标移出
0赞 · 0采集
AminHuang
2015-05-02
setInterval,定时器,自动播放
截图
0赞 · 3采集
LUGY
2015-03-28
setTimeout(动作,间隔时间) 该函数的动作只能执行一次 setInterval(动作,间隔时间) 该函数运行多次 setInterval(function(){}, 300); 简单函数可以在定义时直接传入 function(){} 定义函数 clearInterval 清除定时器 onmouseover 鼠标移上 onmouseout 鼠标移出
0赞 · 3采集
信念意志
2015-02-16
原来用了 animate方法,在网上找到一个比较开源的代码,发现只用区区20行解决,正在研究逻辑结构
1赞 · 0采集
信念意志
2015-02-16
jquery版本的轮播有点不明白,为什么不用animate方法,应该会更简便的,jquery也有自己的定时器,可以用play()和stop()方法操作
0赞 · 0采集
信念意志
2015-02-16
经过优化 传递7个参数
0赞 · 0采集
信念意志
2015-02-16
封装成开源方法,需要传递8个参数 真罕见
0赞 · 0采集
信念意志
2015-02-16
经过验证,图片个数必须大于span页码个数,且模拟第一张图为佳
0赞 · 0采集
信念意志
2015-02-16
经过多方考证,证明len属性是图片个数/翻页个数,index=5也是写死的,所以不能开源,必须要改代码,很麻烦
0赞 · 0采集
信念意志
2015-02-16
源代码有BUG,当图片增加,span页码增加后,对应不上,而且推测是有模拟的层,所以span5个,img7个,那么多加两个用来模拟也不行,右翻页出现空白,而且页码样式失效
2赞 · 9采集
westfall
2015-01-07
settimeout 之所以可以不停的调用 是因为用到了递归 递归 就是一个函数调用自身
0赞 · 0采集
kevinwang
2014-12-22
定义function play()来实现自动切换;设置定时器setInterval(自定义function , 传递执行时间)
截图
0赞 · 0采集
Ethan_0010
2014-11-05
关于定时器: setTimeout(function(),interval)这个set函数每次只能运行一次,只有通过递归(函数调用函数自己)的方式才能不断运行它。 setInterval(function(),interval)这个函数会根据interval有间隔的运行自己,实现其中代码功能。
0赞 · 0采集
数据加载中...