作者pppty (无)
看板Web_Design
标题[问题] 新手请问javascript广告轮播问题
时间Tue Jul 19 20:17:23 2016
各位好 小弟最近上课学到javascript
想试着做出简易像广告轮播的效果(只是初心者 没有想太难)
目前想做出上面一张大图 下面有各个小图
除了大图轮播之外 滑鼠移到小图上会自动切换过去
滑鼠没离开之前大图不会继续轮播
但是写出来之後反应很奇怪
不移到小图上之前是正常轮播
一开始移到小图上也能正确切换
但是一离开之後 大图轮播速度会自动加剧
再移到小图上他也不会停下来@@a
试了好久解决不了 希望能请经验丰富的高手指教
如果不能po在板上 请告知小弟 感谢
以下是我的程式码(注解部分主要是一开始写好的原始码)
修改了很多次 可能跟一开始不一样
(目前没顾虑排版问题XD)
https://gist.github.com/anonymous/7d1f4f0f189de059472cafa7d8c41e97
(现在好像无法缩网址@@)
麻烦前辈们了 非常感谢
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 111.240.229.188
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1468930647.A.FBE.html
※ 编辑: pppty (111.240.229.188), 07/19/2016 20:23:43
1F：推 Ayukawayen: clearInterval要传id进去 (setInterval的回传值) 07/19 21:05
2F：→ Ayukawayen: 没有传 就不会把timer停掉 所以应该会有多个timer在跑 07/19 21:06
3F：→ Ayukawayen: 因此触发timer的频率就会以倍数增加 猜测是这样 07/19 21:06
是的 最初在最下面是设了var interval = setInterval(change,3000);
传到各函式里面是用clearInterval(interval)的方式去做
不过发现他越跑越快以後 我也越来越慌了@@a
所以说我该把程式内容改回原样再找别的问题产生点吗?
现在已经改到不知道该朝哪边找问题了QQ
※ 编辑: pppty (111.240.229.188), 07/19/2016 22:01:06
4F：推 lostnorth: 建议用 jsfiddle 分享局部程式码，方便让帮忙的人预览 07/19 23:53
5F：→ lostnorth: 及修改 07/19 23:53
6F：推 Ayukawayen: 没有实测 这样写有可能interval被覆写掉 所以前一个没 07/20 00:33
7F：→ Ayukawayen: 人去停 一个方法是设个isEnabled变数 滑鼠移进去就设 07/20 00:34
8F：→ Ayukawayen: 去就设为false 移出来就设为true 然後change()里检查 07/20 00:34
9F：→ Ayukawayen: 如果isEnabled是false就不做事等下一次 但没测过 07/20 00:35
10F：推 devil115789: function start(para){var interval=....} 避免覆盖 07/20 11:32
11F：→ devil115789: 不然就是一个大图就用一个object实做 07/20 11:33
12F：→ pppty: 第一次贴程式码 不知道该用哪种分享 不好意思@@a 07/20 16:03
13F：→ pppty: 回家再实测各位大大的建议 如果有问题希望能再向各位请教 07/20 16:04
14F：→ pppty: 感谢 07/20 16:04