JavaScript

パララックス効果を画像に実装できるjQueryプラグイン「Parallax ImageScroll」

Parallax ImageScrollというjQueryプラグインを使えば、パララックス効果を画像に実装することができます。スクロールすることでパララックスを演出できるので、コンテンツと画像に集中したくなりますね。動きがおもしろいですからね。

[ads_center]

Parallax ImageScrollの使い方

Parallax ImageScroll

Parallax ImageScroll デモ

上記から実際のデモを確認することができます。下へスクロールしていくと画像とコンテンツが別々に動きだします。画面いっぱいに使った画像がダイナミックですね。

$('.img-holder').imageScroll();

また、オプションを使用することでパララックス自体のof/offを設定することもできます。他にもパララックスエフェクトのスピードやモバイル時のタッチの有無なんかも指定することが可能です。

Parallax ImageScroll

関連記事

  1. jQuery RS Carousel

    JavaScript

    レスポンシブ対応のシンプルなカルーセルを実装できる「jQuery RS Carousel」

    レスポンシブ対応のシンプルなカルーセルを実装できるjQueryプラグイ…

  2. Wallpaper

    JavaScript

    背景画像のレイアウトをブラウザ幅に合わせてくれるjQueryプラグイン「Wallpaper」

    WallpaperというjQueryプラグインを使えば背景画像のレイア…

  3. S-Pagination

    JavaScript

    スライダー付きのページネーションを実装できる「S-Pagination」

    S-Paginationはスライダー付きのページネーションを実装できる…

  4. JavaScript

    リスト化したテキストを円になるように配置してくれるjQueryプラグイン「Extremes」

    ちょっと面白そうだったので使ってみました。リスト化した各テキストを円を…

  5. no-image

    JavaScript

    シンプルなイメージスライダーとカルーセルを実装できる「SkySlider」

    SkySliderはシンプルで軽量、そしてレスポンシブにも対応したイメ…

  6. no-image

    JavaScript

    シンプルで軽量なスクロールアニメーション実装「animateMePlz」

    animateMePlzはシンプルで軽量なスクロールアニメーションを実…

最近の記事

  1. ジェットストリームの三色ボールペン(+シャーペン付き)と黒の替芯
  2. ブラジルイパネマ
  3. 梅しば
  4. BM-IBCDH13RD

アーカイブ

PAGE TOP