crossfade.js

JavaScript

スクロールで画像をクロスフェードできるjQueryプラグイン「crossfade.js」

crossfade.jsというjQueryプラグインを使えば、スクロールで画像をクロスフェードすることができます。スクロールして画像が上に行くにつれてフェードアウトしていきます。画像にちょっとしたエフェクトをつけたい時なんかによさそうですね。

[ads_center]

crossfade.jsの使い方

このような画像が。

crossfade.js

スクロールしていくと、こんな感じでボカされていきます。で、下からまた新しい画像が来るといった具合です。

フェードアウトしていく

なんかすごいお洒落ですね。画像を多用するブログなんかにすごく合うんじゃないでしょうか。

使い方もわかりやすそうです。

$(function () {
    $('.crossfade').crossfade(options);
});

crossfade.js

Shuffle Images画像をシャッフルすることができるjQueryプラグイン「Shuffle Images」前のページ

CSS3でボックスシャドウが作れるジェネレーター「CSS3 Box Shadow Generator」次のページCSS3 Box Shadow Generator

関連記事

  1. Easy Responsive Tabs to Accordion

    JavaScript

    レスポンシブ対応のタブとアコーディオンで切り替わるjQueryプラグイン「Easy Responsi…

    今すぐにでも使いたいjQueryプラグインを見つけたので備忘録。レスポ…

  2. Greedy Navigation

    JavaScript

    レスポンシブ対応でメニューのアイテム数がわかりやすい「Greedy Navigation」

    Greedy Navigationはレスポンシブ対応でメニューのアイテ…

  3. no-image

    JavaScript

    マスクエフェクトが素敵なスライダー実装「Masked Circle Slider」

    Masked Circle Sliderは、円形のマスクエフェクトが素…

  4. Zoom Slider

    JavaScript

    ズーム機能を備えたシンプルなコンテンツスライダー「Zoom Slider」

    Zoom Sliderは奥行き感を演出したズーム機能を備えたシンプルな…

  5. baffle.js

    JavaScript

    DOM要素内のテキストを難読化させて読めるようにする「baffle.js」

    baffle.jsは、DOM要素内のテキストを暗号化して難読化させ、さ…

  6. no-image

    JavaScript

    シンプルなモバイルメニューを実装できる「offcanvas-mobile-menu」

    offcanvas-mobile-menuは、シンプルでモバイルフレン…

最近の記事

  1. SV-S251
  2. スラウェシ トラジャ
  3. 梅
  4. CAR-HLD12BK

アーカイブ

PAGE TOP