Jquery img code to swap [closed]

-2

I used the code of a guy that the menu is a color when it is at the top and when the scroll of the page goes down, the menu goes black, but as soon as it turns black I want the img that in the case is the logo, change the src that is "logooficial.png" to "logooficial2.png" can you help me if you know? Thanks =)

    
asked by anonymous 28.10.2018 / 06:09

1 answer

1

Pure Jquery:

const window = $(window);
const logo = $('.logo');
window.scroll(function(){
   if( window.scrollTop < 100 )
      logo.attr('src', 'logooficial.png')
   else
      logo.attr('src', 'logooficial2.png')
});

Or you can do it with the help of css

<style>
   .logo {
      background: url('logooficial.png')
   }
   .logo.scrolled {
      background: url('logooficial2.png')
   }
</style>
<script>
   const window = $(window);
   const logo = $('.logo');
   window.scroll(function(){
      if( window.scrollTop < 100 )
         logo.removeClass('.scrolled')
      else
         logo.addClass('.scrolled')
   });
</script>

In this second case, the image should not be set with the tag but rather with a div and the background image with css

    
28.10.2018 / 06:39