隠された可視性（CSS、JS）からの効果をフェードインする方法はありますか？

Question

私のウェブページでは、CSSを使用してopacity=0とを本文に入れ、JSを使用してページが読み込まれたらopacity=1に設定しました。しかし、<div>が表示されないようにしたいので、CSSを使用してvisibility="hidden"を設定します。不透明度を使用した場合、<div>が残りのページに表示されます。

は（私はそれのまわりのセクションに不透明度を適用すると考えるが、私は一度に表示するページ全体をしたいと思います）その中<div>素子1に、体の不透明度を設定するためのいずれか
1.方法はありますが、ではありませんか？
2.不透明度以外のテキストをフェードインする方法（私はjQueryからfadeIn（）を試しましたが、私の可視性がまだ隠されていたときにはうまくいかなかったと思います）

Answer 1

はdivのためvisibility:visibleを適用します。

#main{ 
 
    visibility: hidden; 
 
} 
 
#child{ 
 
    visibility: visible; 
 
}

<div id="main">main is not visible 
 
    <div id="child">child still visible</div> 
 
</div>

あなたは子供が目に見えないし、目に見えるメインにしたい場合は、反対を行います。 （しかし、私は、これはあなたが望むものではないと思います。）このような場合には

#main{visibility:visible;}#child{visibility:hidden;} 

#main視認性が必要ではありません。

Answer 2

ボディが現在表示されていても、不透明度が0に設定されたdivは不可視のままです。その無関係なあなたの質問に http://codepen.io/partypete25/pen/rePXag

CSS

body { 
    opacity:0; 
    background:red; 
    transition:opacity linear 2s; 
} 

div { 
    width:100px; 
    height:100px; 
    background:blue; 
    opacity:0; 
} 

JAVASCRIPT

var x = document.getElementsByTagName("BODY")[0]; 
x.style.opacity = "1";