Proud Member
Proud Member

Reputation: 40496

How to fade in/out an HTML DIV container using JavaScript?

I have an DIV container with an id="myDiv" attribute+value. I'd like to fade this in/out smoothly.

Would I have to create some sort of run loop with an timer and then modify the opacity value of the DIV?

Is jQuery perfect for this kind of stuff?

Upvotes: 0

Views: 3292

Answers (2)

Sarfraz
Sarfraz

Reputation: 382656

The jQuery has fadeIn and fadeOut methods to create the fading effect. You can for example use them like this on your div:

$('#myDiv').fadeOut('slow');

Or you can also use the animate method and specify the opacity option to it to create the fading effect.

Not to forget about the fadeTo method too :)

Upvotes: 4

TuomasR
TuomasR

Reputation: 2316

jQuery is perfect.

$('#myDiv').fadeOut();

http://api.jquery.com/fadeOut/

http://api.jquery.com/fadeIn/

Upvotes: 1

Related Questions