CODEWITHSUNDEEP
jquerycss
Joel
Joel

Reputation: 6173

fade out all objects except one

So I have a div with a background that covers the entire view. Inside of that i have an h2-tag. Is it possible to fade-out the background, whilst unfading the h2-tag?

The structure of the website prevents me from moving the h2-tag outside of the div.

eg. 

$('#intro').fadeTo('slow',0.67,function(){
                $("h2").css("color","black");
                $("h2").css("opacity","1");

Upvotes: 0

Views: 238

Answers (1)

Kolichikov
Kolichikov

Reputation: 3020

This is not possible with fadeTo, because it relies on opacity to control the fade, and you can't set opacity of a child differently than opacity of the parent.

However, see this answer for how to do it using rgba transitions.

You can see this fiddle for fading the div in the background, which you can have fade to zero opacity to effectively make it disappear.

$(function () {
  setTimeout(function () {
    $('#background').animate({
      backgroundColor: 'rgba(0,0,0,0.0)'
    });
  }, 2000);
});

https://jsfiddle.net/p7a4xm7u/8/

Upvotes: 1

Related Questions