概要

何がしたいか？

なんとなくただdisplay:blockでポンと表示されるだけなのは味気ないのでなんかいい感じにアニメーションにしたい・・・

前提

jQueryです。

試したけどうまくいかなかったこと

普通に

$(".hoge").anime({});

とかできるかと思ったらできないみたい・・・・汗

0 -> 1になるときのアニメーションはデフォルトのjQueryではできないみたい。

どうしたらいいだろう？

透過だああああああああああああ！！！！！！！！！

初期表示

dislpay:block 透過度 0 からの

イベントで

display:block->透明じゃなくする・・・といった感じで表示することでいい感じになります。

こんなかんじ

$('#button').on('click',function(){
    $('.target')
        .css('display','block')
        .animate('opacity': 1')
})

追記 追加アイデア

transform: translate(9999px);

とか使ってみてもいいかも