Skip to main content

Return to Question

added 300 characters in body
Source Link
toothie
toothie
  • 1k
  • 4
  • 21
  • 47

This is my jsFiddle. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do?

This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});

This is how it looks in chrome: enter image description here

And this is how it looks in firefox: enter image description here

Also, i have tried both solutions, with jquery and pure css.

This is my jsFiddle. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do?

This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});

This is my jsFiddle. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do?

This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});

This is how it looks in chrome: enter image description here

And this is how it looks in firefox: enter image description here

Also, i have tried both solutions, with jquery and pure css.

just to improve
Source Link
edit approved Dec 21, 2013 at 14:31
Pranav C Balan
edit approved Dec 21, 2013 at 14:31
Pranav C Balan
  • 115.4k
  • 25
  • 173
  • 195

This is my jsFiddle [http://jsfiddle.net/monicaphalswal/xghyz/]jsFiddle. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do? This

This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});

This is my jsFiddle [http://jsfiddle.net/monicaphalswal/xghyz/]. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do? This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});

This is my jsFiddle. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do?

This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});
Source Link
toothie
toothie
  • 1k
  • 4
  • 21
  • 47

Cross browser issue css

This is my jsFiddle [http://jsfiddle.net/monicaphalswal/xghyz/]. It has onHover event which changes the image. It works fine on chrome. But, doesn't work right on firefox. What to do? This is the jQuery function:

$(document).ready(function(){$('.viewport').mouseenter(function(e) { $(this).children('a').children('span').fadeIn(200); }).mouseleave(function(e) { $(this).children('a').children('span').fadeOut(200); });});