I am looking for a theme with a similar functionality where when you hover over a menu item or DIV content, the page background image changes on hover without clicking. Similar to the http://www.72andsunny.com/work page where their portfolio changes BG image as you hover items (desktop). But I am looking for almost the same functionality but with a left menu.
Does anyone know a theme with such function already built-in?
Its 5 min feature and can be created with any wp theme: http://stackoverflow.com/questions/2618699/how-to-change-html-background-with-javascript-function, so if attach event on hover https://api.jquery.com/hover/ on any link - its possible to change site bg. Links to background can be keep in array. Code example:
jQuery(function ($) {
$( "ul#menu-top-menu li a" ).hover(function() {
switch($( this ).attr('id')){
case 'menu-item-15':
$("body").css("background-image", "url(http://www.woocommerce-filter.com/wp-content/uploads/2015/03/must_have.png)");
break:
case 'menu-item-20':
$("body").css("background-image", "url(http://www.woocommerce-filter.com/wp-content/uploads/2015/03/try_now.png)");
break:
case 'menu-item-25':
$("body").css("background-image", "url(http://www.woocommerce-filter.com/wp-content/uploads/2015/03/video-tutorial.png)");
break:
default:
//reset to default bg
$("body").css("background-image", "url(__ANY_DEFAULT_IMG_LINK__)");
break:
}
});
});
To stretch bg on body: http://stackoverflow.com/questions/235855/how-do-i-stretch-a-background-image-to-cover-the-entire-html-element
We can fix it quickly.
You can contact me at pradeep.narava(Skype) ,email me at pradeep.narava@brilliancetechsols.com
We have great experience with JS,html,css.