Browse Source

轮播图增加节流阀

Cathy 4 years ago
parent
commit
05e63fe43e
1 changed files with 25 additions and 14 deletions
  1. 25 14
      pinyougou/js/index.js

+ 25 - 14
pinyougou/js/index.js

@@ -33,25 +33,36 @@ window.onload = function () {
   // 循环图片,克隆第一张放到尾部
   ul.appendChild(ul.children[0].cloneNode(true));
   var num = 0;
+  var flag = true;// 节流阀,水龙口开关控制是否完成一次图片滚动,防止不停的点
   arrow_l.addEventListener('click',  function () {
-    if(num == 0){
-      num = ul.children.length-1;
-      ul.style.left = -1 * num * focus.offsetWidth + 'px';
+    if(flag){
+      flag = false;
+      if(num == 0){
+        num = ul.children.length-1;
+        ul.style.left = -1 * num * focus.offsetWidth + 'px';
+      }
+      num--;
+      var left = -1 * num * focus.offsetWidth;
+      animate(ul, left, function () {
+        flag = true;
+      });
+      liChange(ol.children[num%ol.children.length]);
     }
-    num--;
-    var left = -1 * num * focus.offsetWidth;
-    animate(ul, left);
-    liChange(ol.children[num%ol.children.length]);
   });
   arrow_r.addEventListener('click',  function () {
-    if(num == ul.children.length-1){
-      num = 0;
-      ul.style.left = 0;
+    if(flag){
+      flag = false;
+      if(num == ul.children.length-1){
+        num = 0;
+        ul.style.left = 0;
+      }
+      num++;
+      var left = -1 * num * focus.offsetWidth;
+      animate(ul, left, function () {
+        flag = true;
+      });
+      liChange(ol.children[num%ol.children.length]);
     }
-    num++;
-    var left = -1 * num * focus.offsetWidth;
-    animate(ul, left);
-    liChange(ol.children[num%ol.children.length]);
   });
   var timer = setInterval(() => {
     arrow_r.click();