在兩個斷點之間調整窗口大小之後，現在使用的slide innerWidth（）取自我調整大小的斷點，而不是進入

Question

爲什麼在窗口調整大小在2個斷點之間之後，現在使用的slide innerWidth（）從突破點我採取調整 從，不進？

爲了更精確：

https://jsfiddle.net/ecm3d30z/1/

1. 例如我在斷裂點1（以上800像素）

2. 我做窗口從斷裂點1至斷裂點2調整（800px以下）。

3. 下面我就斷裂點2（下面800像素）

4. 然後我點擊下一個/上按鈕

5. 動畫使用oneslidewidth的寬度從斷裂點1，而它應該使用oneslidewidth的寬度從beradking點2

   app = { 
   
   hubert:function() { 
   
        var num = $(".testimonial").length; 
        var oneslidewidth = $(".testimonial").innerWidth(); 
        var oneslideheight = $(".testimonial").innerHeight(); 
        var fullsliderwidth = num * oneslidewidth;   
        var active = false; 
   
   
   
       $("section").css({ 
        width: oneslidewidth, 
        height: oneslideheight 
       }); 
   
       $(".calosc").css({ 
       width: fullsliderwidth 
       }); 
   
   
   
       function changehook(direction) { 
       var slide = parseInt($(".calosc").data("slide")); 
       if (direction == "next") { 
        slide++ 
        $(".calosc").data("slide", slide); 
       } else if (direction == "prev") { 
        slide-- 
        $(".calosc").data("slide", slide); 
       } 
       } 
   
   
   
       $('.next').click(function(e) { 
       e.preventDefault(); 
        if(active || parseInt($(".calosc").data("slide")) + 1 > num) { 
        return; 
        } 
       changehook("next"); 
       active = true; 
       $(".calosc").animate({'left' : $(".calosc").position().left-oneslidewidth},500, function() { 
          {active = false;} }); 
         }); 
   
   
       $(".prev").on("click",function(e) { 
        e.preventDefault(); 
        if(active || parseInt($(".calosc").data("slide")) - 1 < 1) { 
        return; 
        } 
       changehook("prev"); 
       active = true; 
       $(".calosc").animate({'left': $(".calosc").position().left+oneslidewidth},500, function() { 
         { active = false; } }); 
       }); 
   } 
   } 
   

Answer 1

不擅長解釋，但基本上是：An example of variable shadowing in javascript

乍一看，它應該已經工作的範圍似乎是正確等。我不知道的jQuery請問這背後：$(".prev").on("click",function(e) {，不是設定的功能和覆蓋聽衆？或添加一個新的監聽器？或者不做任何事情已經有一套。

所以不管怎麼說，解決它的一種方式，將「重新定義」的oneslidewidth你的點擊函數中，這樣的事情：

$('.next').click(function(e) { 
    // Here \/ 
    var oneslidewidth = $(".testimonial").innerWidth(); 
    e.preventDefault(); 
    if(active || parseInt($(".calosc").data("slide")) + 1 > num) { 
    return; 
    } 
    changehook("next"); 
    active = true; 
    $(".calosc").animate({'left' : $(".calosc").position().left-oneslidewidth},500, function() { 
    {active = false;} 
    }); 
}); 

另一種方法是來包裝你的「數據」到一個對象，或者使它們成爲全局的。這是更新後的版本，將變量放入對象中。

https://jsfiddle.net/ecm3d30z/2/

順便說一句..那裏有另一個錯誤：改變2+頁面，並調整大小..它只是打破了..，但如果你將其改回第1頁，並調整..一切工作再次¯ \ _（ツ）_ /¯