Else Wenn Bedingte logische Operatoren in Jquery nicht funktionieren

Question

Ich habe Probleme bei der Einstellung von Animationen, wenn das Browserfenster eine andere Größe hat.

Im folgenden Code funktioniert nur der erste If-Block. Der else If Block funktioniert nicht, es gibt keine Syntaxfehler.

Danke für die Hilfe.

$(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

Ihr sonst ist an der falschen Stelle:

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();    
     } 
    } 
} 
}); 

Statt:

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();    
     } 
    } 
} 
});