Replace item in menu using only custom.css in Word

Question

I would like to replace this image when I scroll down on another image.

Firstly, the menu looks like:

And when I scroll little bit down menu looks like:

Is it possible to replace using custom.css this item in menu? I just want to replace this picture on another picture. Is it possible to do by using only custom.css or do I need to have acces to files and use here java script?

When it's possible can somene just tell how?

Link to my site : http://test.projekt-tenis.pl/wordpress/

Answer 1

Give this a whirl:

.is-sticky img.menu-image-title-hide {
    background: url(http://www.spiritvoyage.com/blog/wp-content/uploads/Screen-shot-2011-12-06-at-2.56.08-PM-150x150.png) no-repeat;
    width: 150px;
    height: 150px;
    padding-left: 150px;
}

Should do the trick. It moves the original src image out of the way and adds a background image. As far as your user is concerned it'll just look like it flips from one image to the other.

It works because the class .is-sticky is added to the header on scroll by js.