Docs

[ADBL]

Hi there —

On one (Integrity) page and all child pages, I need to display a different logo image and also modify the href (link) value.

To change the image, I’m (successfully) using:

jQuery(".x-brand img").attr("src","http://mysite.com/otherlogo.png");

I wasn’t able to change the link though. I tried both:

jQuery(".x-brand img").attr({src:http://mysite.com/otherlogo.png,href:"http://mysite.com/otherlink"});

and

jQuery(".x-brand img").attr("src","http://mysite.com/otherlogo.png").prop("href","http://mysite.com/otherlink");

No luck. Can you guys help?

Also, is there a way so that all child page can inherit logo and link change from parent (other than adding custom code to each child page)?

Thanks a lot.

[Thai]

Hi There,

Please try with this code:

jQuery(".x-brand").attr("href","http://mysite.com/otherlink");

Hope it helps 🙂

[ADBL]

Thanks a lot!

I’m seeing that when the page loads, the default logo flashes for a couple of milliseconds. Do you know if there is a way to prevent the default logo from showing completely? TIA.

[Rupok]

Hi there,

Thanks for writing back. Actually the logo will be changed after loading on front-end as you are changing from front-end, so you might not avoid the flash. You can still try to use your code within onload :

(function ($) {
  $(window).load(function(){
     
    //Use your JS here

  }); 
}(jQuery));

I can’t guarantee but you can try this if that helps.

Cheers!

[ADBL]

Thanks a lot! Any way I could fade from default to alternate, then?

[Rupok]

Hi there,

That might be possible by using transition with CSS. Like :

.x-brand {
  -webkit-transition: all 1s;
  transition: all 1s;
}

Let’s see if that works then adjust the value.

Cheers!

[Author]

Posts