如果JavaScript跳过其他内容？

Question

很明显，这将是我的一个愚蠢的错误，因为如果不工作，为什么还要别人呢？

但是，我犯了一个错误的地方，我找不到，现在我的JavaScript只是'跳过'我的其他如果我的代码中的声明。

$(window).resize(function(){ 

    if ($(window).width() <= 1080) { 
     responsiveLength = 2; 
     maxMargin = -((imgLength - responsiveLength) * imgWidth); 
     imgWrapper.css('margin-left','0'); 
    } else if ($(window).width() <= 700){ 
     console.log($(window).width()); 
     maxMargin = -((imgLength - 0) * imgWidth); 
     imgWrapper.css('margin-left','0'); 
    } else { 
     responsiveLength = 3; 
     maxMargin = -((imgLength - responsiveLength) * imgWidth);  
     imgWrapper.css('margin-left','0'); 
    } 

}); 

在此先感谢

Answer 1

您需要交换这两个因为700小于1080决不去那里。

if ($(window).width() <= 700) { 
    console.log($(window).width()); 
    maxMargin = -((imgLength - 0) * imgWidth); 
    imgWrapper.css('margin-left','0'); 
} else if ($(window).width() <= 1080) { 
    responsiveLength = 2; 
    maxMargin = -((imgLength - responsiveLength) * imgWidth); 
    imgWrapper.css('margin-left','0'); 
} else { 
    responsiveLength = 3; 
    maxMargin = -((imgLength - responsiveLength) * imgWidth);  
    imgWrapper.css('margin-left','0'); 
} 

替代的解决方案，确保窗口大小比700px更多：

if ($(window).width() <= 1080 && $(window).width() > 700) { 

逻辑的解释

让我们在这里考虑的逻辑。

• 屏幕尺寸：600px
  每种不超过1080？是。
  去第一个街区。

• ScreenSize：1000px
  LessThan 1080？是。
  去第一个街区。

• ScreenSize：1600px
  LessThan 1080？第
  去第三个街区。

Answer 2

排列从最低分辨率到最高分辨率的条件。

if ($(window).width() <= 700) { 
    .... 
} else if ($(window).width() <= 1080) { 
    .... 
} else { 
    .... 
} 

Answer 3

它将达不到别的，如果因为$(window).width() <= 1080意味着$(window).width() <= 700为好。

我想你想要做的

if ($(window).width() <= 1080 && $(window).width() > 700) { 
    responsiveLength = 2; 
    maxMargin = -((imgLength - responsiveLength) * imgWidth); 
    imgWrapper.css('margin-left','0'); 
} else if ($(window).width() <= 700){ 
    console.log($(window).width()); 
    maxMargin = -((imgLength - 0) * imgWidth); 
    imgWrapper.css('margin-left','0'); 
} else { 
    responsiveLength = 3; 
    maxMargin = -((imgLength - responsiveLength) * imgWidth);  
    imgWrapper.css('margin-left','0'); 
} 

或颠倒顺序

if ($(window).width() <= 700) { 
    responsiveLength = 2; 
    maxMargin = -((imgLength - responsiveLength) * imgWidth); 
    imgWrapper.css('margin-left','0'); 
} else if ($(window).width() <= 1080){ 
    console.log($(window).width()); 
    maxMargin = -((imgLength - 0) * imgWidth); 
    imgWrapper.css('margin-left','0'); 
} else { 
    responsiveLength = 3; 
    maxMargin = -((imgLength - responsiveLength) * imgWidth);  
    imgWrapper.css('margin-left','0'); 
}