博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javaScript实现焦点轮播图界面效果(三)
阅读量:6610 次
发布时间:2019-06-24

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

hot3.png

一、左右

1.获取元素并设置索引,这里定义的变量index是用来表示底部小圆点的位置

2左右按钮的点击事件

每点击一次左侧按钮,图片会向右侧滚动一次,div的left值就会增加一个图片的宽度,没点击一次右侧的按钮,图片会向左侧滚动一次,div的left值会减小一个图片的宽度。左右两侧按钮进行的操作很相似,在这里我们封装一个方法。

在这个方法中我们要对滚动的位置做出判断,主要当点击右侧按钮,滚动到最后一张图片的时候,再次点击右侧按钮是要滚动到第一张图片,所以此时left值不能再减小一个图片的宽度,而是让left值为-imgthWidth即一张图片的宽度。当点击左侧按钮,滚动到第一张图片的时候,再次点击左侧按钮是要滚动到最后一张图片,所以此时left值不能再增加一个图片的宽度,而是让left值为-imgthWidt*4.。

3.左右按钮绑定

转载于:https://my.oschina.net/u/2971691/blog/823258

你可能感兴趣的文章
【Flask】遇到的问题
查看>>
MERGE用法详解
查看>>
我的友情链接
查看>>
详解HDFS Short Circuit Local Reads
查看>>
具动画效果的图片转换器ImageSwitcher
查看>>
linux下安装open***服务端和客户端(转载)
查看>>
mysql的复制模式
查看>>
loser们的共同特征 zz from caoz
查看>>
Concurrent包常用方法简介
查看>>
ConcurrentHashMap和Hashtable的区别
查看>>
LB Cluster 之三:持久连接及健康检测
查看>>
Mysql命令行添加用户
查看>>
高效缓存服务器Memcached(一)
查看>>
我的友情链接
查看>>
intellij IDEA tab键变成了四个空格
查看>>
OGG复制进程延迟处理思路与方法
查看>>
支付宝防并发方案之"一锁二判三更新"
查看>>
五 Lync Server 2013 部署指南-边缘部署
查看>>
c++位运算及相关操作
查看>>
JIRA如何个性化定制工作流?
查看>>