[Solved] CSS Transition Cancels jQuery FadeIn?

[Rugg]

There appears to be a conflict when using CSS transition and jQuery fadeIn on the same element. If the element has a transition, the fadeIn fails to execute, otherwise it works as intended. Unfortunately for my case I need to use both. They share the same element, but each is used for a completely unrelated output.

Any ideas how to resolve the conflict and allow both to work on the same element?

CSS:

.test {
   opacity: 0;
   transition: opacity 1s ease;
}

.test.active {
   opacity: 1;
}

JS:

$(window).resize(function () {
     $('.test').fadeIn(500);
});

[Rugg]

SOLVED

I ended up using an separate class specifically for the transition.

[Author]

Posts