否則如果有條件的邏輯運算符不工作在Jquery

Question

我在瀏覽器窗口大小不同時設置動畫時有問題，換句話說，動畫響應。

在下面的代碼中，只有第一個If塊有效。 else If塊不起作用，沒有語法錯誤。

感謝您的幫助。

$(window).scroll(function(){ 
var firstAnimation = function() { 
    $('#in-view').delay(300).css("display","block").animate({   
     opacity:1, 
     right: -150 
    },'slow'); 
}; 

var h4Animation = function() { 
$('#hr1').delay(500).animate({ 
    width: '60%' 
},'200'); 
}; 


if ($(window).width() <= 768) { 
    if ($(window).scrollTop() > 200) { 
     h4Animation(); 
     firstAnimation();  
    } else if ($(window).width() >= 769) { 
     if ($(window).scrollTop() > 100) { 
      h4Animation(); 
      firstAnimation();    
     } 
    } 
} 
}); 

Answer 1

你的其他人在錯誤的地方：

if ($(window).width() <= 768) { 
    if ($(window).scrollTop() > 200) { 
     h4Animation(); 
     firstAnimation();  
    } else if ($(window).width() >= 769) { // how can window width be both <= 768 and >= 769? 
     if ($(window).scrollTop() > 100) { 
      h4Animation(); 
      firstAnimation();    
     } 
    } 
} 
}); 

相反：

if ($(window).width() <= 768) { 
    if ($(window).scrollTop() > 200) { 
     h4Animation(); 
     firstAnimation();  
    } 
} 
else if ($(window).width() >= 769) { // the condition isn't really necessary since if it is not <= 768 it will be >= 768 
     if ($(window).scrollTop() > 100) { 
      h4Animation(); 
      firstAnimation();    
     } 
    } 
} 
});