jQueryでフェードイン(fadeIn)しない場合は

2016年09月26日

  1. TOP
  2. BLOG
  3. HTML
  4. jQueryでフェードイン(fadeIn)しない場合は

jQUeryのfadeIn()で格好良く表示させようと思ったらfadeInしないで「即表示した」もしくは「表示されない」といったことがありました。その他にも原因はあると思いますが私がハマったのは以下のケースです。

前提

条件:以下のdivタグをjqueryを使って一旦消してから表示したい

◆HTML

◆CSS

解決案

これ考え方が悪かったのですがフェードインは透明度をどんどん低くして不透明にすることだから、

display: noneで非表示にするのではなく透明度を設定するopacity: 0にしていたのがまずかった・・・・。
これが原因でfadeInしませんでした・・・・