图片轮番自动切换,鼠标悬停方块那里停住,失去焦点又恢复自动切换,点一下可以切换到指定图片
2条回答 默认 最新
- CSDN专家-showbo 2021-10-06 19:43关注
大概写了个,有帮助麻烦点个采纳【本回答右上角】,谢谢~~
<!doctype html> <meta charset="utf-8" /> <style> body { background: #333 } .dots a { width: 45px; height: 45px; background: #666; display: block; margin-bottom: 5px; text-decoration: none; margin-left: 15px } .dots a.focus { background: #fc3 } .slider div { background: #000; color: #fff; text-align: center; line-height: 30px } .slider img { width: 430px; height: 470px; display: block; border: 0 } </style> <table align="center"> <tr> <td class="slider"> <div></div> <img /> <div></div> </td> <td class="dots" valign="top"> <a href="https://t7.baidu.com/it/u=2385494716,931161584&fm=193&f=GIF" title="图片一"></a> <a href="https://t7.baidu.com/it/u=2556336625,2995391728&fm=193&f=GIF" title="图片二"></a> <a href="https://t7.baidu.com/it/u=3541892791,1735760555&fm=193&f=GIF" title="图片三"></a> <a href="https://t7.baidu.com/it/u=1282096981,141440035&fm=193&f=GIF" title="图片四"></a> </td> </tr> </table> <script src="https://g.csdnimg.cn/??lib/jquery/1.12.4/jquery.min.js"></script> <script> var timer, slider = $('.slider'), divs = slider.find('div'), img = slider.find('img'), cur = 0; function startTimer() { console.log('startTimer') timer = setInterval(function () { cur++; if (cur >= as.length) cur = 0; as.eq(cur).trigger('click') }, 4000);//4秒切换一次,其他时间改这里 } var as = $('.dots a').mouseenter(function () { clearInterval(timer) console.log('clearInterval')}).mouseleave(startTimer).click(function () { img.attr('src', this.href); var el = $(this); el.siblings().removeClass('focus'); cur = el.addClass('focus').index(); divs.eq(0).html(cur + 1 + '/' + as.length); divs.eq(1).html(el.attr('title')); return false; }); as.eq(cur).trigger('click'); startTimer(); </script>
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥15 RPA正常跑,cmd输入cookies跑不出来
- ¥15 求帮我调试一下freefem代码
- ¥15 matlab代码解决,怎么运行
- ¥15 R语言Rstudio突然无法启动
- ¥15 关于#matlab#的问题:提取2个图像的变量作为另外一个图像像元的移动量,计算新的位置创建新的图像并提取第二个图像的变量到新的图像
- ¥15 改算法,照着压缩包里边,参考其他代码封装的格式 写到main函数里
- ¥15 用windows做服务的同志有吗
- ¥60 求一个简单的网页(标签-安全|关键词-上传)
- ¥35 lstm时间序列共享单车预测,loss值优化,参数优化算法
- ¥15 Python中的request,如何使用ssr节点,通过代理requests网页。本人在泰国,需要用大陆ip才能玩网页游戏,合法合规。