Docs

[yhshin1020]

Hey,

I went ahead and used the solution from other threads to customise my header logo on different pages using this jquery:

jQuery(".page-id-1357 .x-brand img").attr("src","http://www.guidedogssg.com/wp-content/uploads/2016/07/unnamed.png");

The code works perfectly fine when you load the page but when I have a Javascript script suggested by one of the support staff that makes the header change size and color when you scroll down. (https://community.theme.co/forums/topic/header-that-resizes-when-scrolling-down/)

So on page load the alternate logo is showing up fine but when you scroll down and then back up the logo turns white again (to the normal logo uploaded in customiser).

how can I fix the image from returning back to normal?

Thanks.

[yhshin1020]

This reply has been marked as private.

[Paul R]

Hi,

Please change your js code to this.

jQuery(function($) {
    $('.x-navbar-fixed-top').css("background-color", "transparent");
    $(window).scroll(function(){
        if ($(this).scrollTop() >10) {
            $('.x-navbar-fixed-top').css("background-color", "#fff");
                        $('.x-brand img').css("width", "70px");
                        $('.x-navbar-fixed-top .x-brand img').attr('src','http://www.guidedogssg.com/wp-content/uploads/2016/07/unnamed.png');
        } else {
            $('.x-navbar-fixed-top').css("background-color", "transparent"); 
                        $('.x-barnd img').css("width", "80%");
                        $('.x-brand img').attr('src','http://www.guidedogssg.com/wp-content/uploads/2016/10/Untitled-1-1.png');
                        $(".page-id-1357 .x-brand img").attr("src","http://www.guidedogssg.com/wp-content/uploads/2016/07/unnamed.png");
        }
    });
     $(window).scroll(function(){ 
        if($(window).scrollTop()<=0) {
              $('.x-navbar').removeClass("x-navbar-fixed-top");
      }
    });
});

Hope that helps

[yhshin1020]

This reply has been marked as private.

[Rahul]

Hey There,

Thanks for writing back!

Everything seems to be working fine on my end.

Can you please confirm it by double checking it?

Thanks for understanding!

[yhshin1020]

My bad, its showing up on my phone only!

Thanks!!

[Joao]

Glad to hear we managed to help,

Please let us know if you need help with anything else.

Joao

[Author]

Posts