basicScroll

JavaScript

モバイル・デスクトップに対応したパララックススクロール実装「basicScroll」

basicScrollはモバイル・デスクトップに対応したスタンドアローンによるパララックススクロールを実装できます。CSSの変数を使用するとのことで、スクロール位置に応じてCSSの変数を変更できるのが特徴です。

basicScroll

デモ

デモでは上下にスクロールすることで、グラデーションカラーの正方形がコロコロと回転していくアニメーションを見ることが可能です。スクロールの位置に応じてCSSの変数を変更できるので、このような動きも可能になっています。

画像を使わなくてもCSSやJSを用いることでこのような楽しいパララックススクロールを実装できるのはとても便利ですね。

APIには.create(html, opts)、.start()、.stop()、.update()、.calculate()、.isActive()、.getData()が用意されています。また、スタートとストップの位置を指定できたりコールバック関数を設定できたり、カスタマイズ性も高くなっています。

モバイルとデスクトップに対応したスタンドアローンによるパララックススクロールを取り入れたい人は、ぜひ「basicScroll」を使われてみてはいかがですか?

basicScroll

関連記事

  1. no-image
  2. Multi-device scrolling menu
  3. Guardian

    JavaScript

    フォームにバリデーションを実装できるjQueryプラグイン「Guardian」

    Guardianはフォームにバリデーション機能を実装することができるj…

  4. mFancyTitle

    JavaScript

    ブラウザのタブにあるファビコンとタイトルをアニメーション化できる「mFancyTitle」

    mFancyTitleは、ブラウザのタブに表示されているファビコンとタ…

  5. Enllax.js

    JavaScript

    軽量で簡単なパララックスを実装できるjQueryプラグイン「Enllax.js」

    Enllax.jsは軽量で使い方も簡単なパララックスエフェクトを実装す…

  6. jQuery Bar Rating

    JavaScript

    選択範囲を評価ウィジェットに変換できる「jQuery Bar Rating」

    jQuery Bar Ratingは、ユーザーが選択する範囲を評価ウィ…

最近の記事

  1. TAP-F27-2KP
  2. M32ミニ
  3. CITTA TT5.0
  4. Kindle Oasis

アーカイブ

PAGE TOP