CodingForums.com - fadeIn, fadeOut issue

CodingForums.com (http://www.codingforums.com/index.php)

- JavaScript frameworks (http://www.codingforums.com/forumdisplay.php?f=62)

- - fadeIn, fadeOut issue (http://www.codingforums.com/showthread.php?t=274975)

ajh108

10-02-2012 09:06 PM

fadeIn, fadeOut issue

Hi,

I have a hover effect whereby an image is being faded out and another is fading in. However, Is there a way for these actions to happen simultaneously? So as one is fading out the other fades in.

The second image is displayed none on page load.

My code so far is:

Code:

$('.square').mouseenter(function () {

    $(this).attr('data-image', 'two');

    $(this).find('.one').fadeOut('medium');

    $(this).find('.two').fadeIn('medium');

});

Thanks,

felgall

10-02-2012 11:35 PM

What you are looking for is usually called a cross fade.

I am not sure whether the JavaScript framework you are using one provides that functionality but it is definitely possible to do using JavaScript.

VIPStephan

10-03-2012 12:59 AM

Quote:

Originally Posted by ajh108 (Post 1275695)

However, Is there a way for these actions to happen simultaneously? So as one is fading out the other fades in.

That is exactly what should happen with your code. What’s the problem?

All times are GMT +1. The time now is 10:15 AM.