CSS:マウスオーバー時に画像をゆっくり透過させる方法 | うぇぶ小屋

ホーム / CSS / CSS:マウスオーバー時に画像をゆっくり透過させる方法
  • 2012/12/16
  • CSS:マウスオーバー時に画像をゆっくり透過させる方法

    CSS:マウスオーバー時に画像をゆっくり透過させる方法

    マウスオーバー時に画像にフェード効果を与えて透過させるCSSです。

    結構定番なので使用頻度も高いと思います。

    DEMO
    CSS:マウスオーバー時に画像をゆっくり透過させる方法

    transitionを使ってアニメーションを加えています。

    CSS
    実際に画像を透過させる時は画像URLの後にclass="fade"を入れればOKです。


    以上参考になれば幸いです。

    この記事を読んだ人はこんな記事も読んでます

    TwitterやFacebookページでは日々うぇぶ小屋が気になった情報(ウェブ制作・運営、ブログの収益化に関する事が多い)をつぶやいていますのでこの機会にぜひ"フォロー"または"いいね"をよろしくお願いします。


    Twitterアカウント → @webgoya
    Facebookページ → webgoya
    RSSフィードを配信しています → RSS購読はこちら

    コメント一覧
    この記事にコメントを残す
    管理者にだけ表示を許可する

    人気記事

    最新のエントリー

    カテゴリ

    ライター募集!