|
@@ -119,8 +119,12 @@
|
|
|
// 获取左右按钮
|
|
|
var leftBtn = document.getElementsByClassName("arr-btn")[0];
|
|
|
var rightBtn = document.getElementsByClassName("arr-btn")[1];
|
|
|
+ // 获取整个轮播图区域
|
|
|
+ var oSwiper = document.getElementsByClassName("container")[0];
|
|
|
// 定义全局变量放置当前索引值
|
|
|
var nowIndex = 0;
|
|
|
+ // 定义定时函数全局变量
|
|
|
+ var timer = null;
|
|
|
|
|
|
|
|
|
// 定义切换轮播图函数
|
|
@@ -152,22 +156,43 @@
|
|
|
// 绑定向右按钮事件
|
|
|
rightBtn.onclick = function () {
|
|
|
// 判断数字是否是最后一个 如果是的从第一个开始
|
|
|
- if(nowIndex == 4){
|
|
|
+ if (nowIndex == 4) {
|
|
|
changeSwiper(0);
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
changeSwiper(nowIndex + 1);
|
|
|
}
|
|
|
}
|
|
|
// 绑定向左按钮事件
|
|
|
leftBtn.onclick = function () {
|
|
|
// 判断数字是否是第一个 如果是的从最后一个开始
|
|
|
- if(nowIndex == 0){
|
|
|
+ if (nowIndex == 0) {
|
|
|
changeSwiper(4);
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
changeSwiper(nowIndex - 1);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ // 实现每隔1秒钟自动切换一次
|
|
|
+ function autoChange() {
|
|
|
+ timer = setInterval(function () {
|
|
|
+ if (nowIndex == 4) {
|
|
|
+ changeSwiper(0);
|
|
|
+ } else {
|
|
|
+ changeSwiper(nowIndex + 1);
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+ autoChange();
|
|
|
+
|
|
|
+ // 实现鼠标移入轮播图区域停止自动切换
|
|
|
+ oSwiper.onmouseenter = function () {
|
|
|
+ clearInterval(timer);
|
|
|
+ }
|
|
|
+ // 实现鼠标移出轮播图区域开始自动切换
|
|
|
+ oSwiper.onmouseleave = function () {
|
|
|
+ autoChange();
|
|
|
+ }
|
|
|
+
|
|
|
// 给数字按钮绑定事件
|
|
|
// for(var i=0;i<aNumBtn.length;i++){
|
|
|
// // 给每个数字按钮绑定一个索引值
|