Estoy tratando de cambiar un logotipo según la sección por la que pasa (logotipo claro en la sección oscura y viceversa) usando jQuery scrollTop. La primera regla se ejecuta correctamente, el logotipo cambia después de 450, pero la segunda regla no se ejecuta en 470, lo cual es extraño ya que el resto funciona bien. El logotipo vuelve a su estado original. Aquí está mi fragmento de WP JS:

 jQuery(document).on('scroll', function() { if (jQuery(this).scrollTop() > 450) { jQuery('.navbar-brand img').attr('src','http://localhost/site/wp-content/uploads/2021/09/mini-logo.png'); } else if (jQuery(this).scrollTop() > 470) { console.log("it works"); jQuery('.navbar-brand img').attr('src','http://localhost/site/wp-content/uploads/2021/09/dark-f-logo.png'); } else { jQuery('.navbar-brand img').attr('src','http://localhost/site/wp-content/uploads/2021/09/dark-f-logo.png'); } });

Gracias por echar un vistazo.