Check out my jsFiddle for an example of an onHover event that changes the image. It's working perfectly in chrome, but not quite right in firefox. Any suggestions on how to fix it?
Here's the jQuery function I'm using:
$(document).ready(function() {
$('.viewport').mouseenter(function(e) {
$(this).children('a').children('span').fadeIn(200);
}).mouseleave(function(e) {
$(this).children('a').children('span').fadeOut(200);
});
});
Here is how it appears in chrome:
And here is how it looks in firefox:
I've already tried implementing solutions with both jquery and pure css, but still facing this issue.