0

I have the following JS, that changes my header colour and menu text colours once the user scrolls past a certain point. 

//Fade in header
$(window).on("scroll", function () {
 if ($(this).scrollTop() > 50) {
    $("body.home header, body.page header").css("background","#fff");
        $("body.home header, body.page header").css("box-shadow","0px 2px 4px -2px rgba(0, 0, 0, 0.15)");
        $("body.home header, body.page header").css("transition","1s");
            $(".nav-menu ul li a").css("color","#222");


 }
else {
    $("body.home header, body.page header").css("background","none");
    $("body.home .nav-menu ul li a, body.page .nav-menu ul li a").css("color","#fff");
            $("body.home header, body.page header").css("box-shadow","none");

 }
 });

I now need to adapt this to also switch out the white version of my logo for the black one. The current HTML code for the logo is:

<div id="logo"><img src="<?php bloginfo('template_directory'); ?>/img/logo.png" width="125px" style="padding: 10px;" /></div>

The black logo is called logo-black.png and is located in the same place.

How do I adapt the code to switch the logos?

Thanks in advance

Mikedefieslife
  • 421
  • 1
  • 6
  • 14
  • Bizarrely neither of those two solutions seem to work in my case. There's just no effect, and no errors or anything in the console. – Mikedefieslife Sep 11 '15 at 20:19

2 Answers2

0
var imgLogoEl = $("logo").find('img:first');
var currentSrc = imgLogoEl.src;
var newSrc = currentSrc.replace('logo.png', 'logo-black.png');
imgLogoEl.src = newSrc;

This is verbose to show you what steps are needed, you could also just do this:

$("logo").find('img:first').src.replace('logo.png', 'logo-black.png');

That's one way to do it... however, you could get creative and use some jQuery toggling.

El Guapo
  • 5,581
  • 7
  • 54
  • 82
0

You can find an almost identical question here. To answer your question, I would do the following: $('#logo > img').attr('src', 'path/to/img/name.png');

Community
  • 1
  • 1
Stephan Genyk
  • 177
  • 1
  • 6