transition background-image/css change on hover?
- by John Isaacks
I have a thumb nail inside another div, when the thumbnail is hovered I want the parent div to fade/transition to the background of the thumbnail, then fade back to the original image after hover.
I have this so far which changes the parent background to that of the thumbnail and back but with no transition.
$(document).ready(function() {
var originalBG;
var hoverBG;
$(".alt-img").hover(
function () {
originalBG = $(this).parent().css('backgroundImage');
hoverBG = $(this).css('backgroundImage');
$(this).parent().css('backgroundImage',hoverBG);
},
function () {
$(this).parent().css('backgroundImage',originalBG);
}
);
});