【jQuery】ふわっと消えるアニメーション

毎日色々と実験中。
特にアニメーションのキューの理解があんまりできてない。
まずは色々と動かしてみるぜ!!
しかしWorspressだとコードインデントがいちいち入らなくて書きづらいよ~~。どうにかならないのか~~。


デモ


▼下記の画像をクリックすると動作します。ふわっとな。



コード


html

/*何か画像*/
<img id="example" src="http://wakana.me/wp/wp-content/uploads/2013/02/wackworks_logoh80px.png" />

javascript

$(function(){
    $('#example').click(function(){
        $(this).css('position','relative')
        .animate({
        opacity : 0,
        top: $(window).height() - $(this).height() - $(this).position().top
        },
        'slow',
        function(){$(this).hide();
        });
    });
});

← 過去の投稿へ

次の投稿へ →

1件のコメント

  1. 初めまして。
    サイトの中(会員専用画面)で、そのまま使わせていただきました。
    jQueryって、いろいろできるんですね。
    どうもありがとうございました!とても助かりました。
    ちゃんと勉強しなければな…とも、思いました。

コメントを残す

メールアドレスが公開されることはありません。