jquery.autoscroll-text-tape

JavaScript

テキストを自動スクロールできる「jquery.autoscroll-text-tape」

jquery.autoscroll-text-tapeはテキストを水平に自動でスクロールさせることができるjQueryプラグインです。自動でスクロールさせたりホバーしたときにだけスクロールさせたりといったことができます。

jquery.autoscroll-text-tape

デモ

デモページでは、WITHOUT PLUGIN、WITH PLUGIN (DEFAULT)、WITH PLUGIN (MOVE ON HOVER)といったサンプルがいくつか用意されています。

テキストが自動で水平方向にスクロールしているものやホバー時にスクロールされるものなどの動作を確認できます。

ちなみに、ホバーしたときにスクロールをするか否かはオプションの「moveOnHover」で設定可能です。ホバー時にスクロールしたい場合はここの値を「true」にすればOKです。

ほかにも、speedやtapeOffsetというオプションも用意されています。スクロールのスピード調節は「speed」から設定します。値は「slow」「normal」「fast」のなかから指定可能です。

また、ブラウザ幅を縮小・拡大してみるとわかると思いますが、デモはレスポンシブにも対応しています。

PC、スマホ、タブレットなどいろんなデバイスで見れるテキストの自動スクロールを実装したいという人は、ぜひ「jquery.autoscroll-text-tape」を活用されてみてはいかがでしょうか?

jquery.autoscroll-text-tape

関連記事

  1. Sidr

    JavaScript

    横からサイドメニューが現れるjQueryプラグイン「Sidr」

    面白いjQueryプラグインがあったのでメモがてらご紹介します。Sid…

  2. jQuery Pretty Dropdowns
  3. no-image

    JavaScript

    ページ読み込み時に画面上部にプログレスバーを表示する「Skylo」

    Skyloはページ読み込み時にプログレスバーを画面上部に表示できるのが…

  4. no-image

    JavaScript

    カードを入れ替えるような3Dアニメーションによるスライダー「stack-slider」

    stack-sliderはカードを入れ替えるような3Dアニメーションに…

  5. Background Blur

    JavaScript

    画像をボカしてくれるクロスブラウザ対応の「Background Blur」

    Background Blurは画像をカッコよくボカしてくれるクロスブ…

  6. jquery.stepper.js

    JavaScript

    マウス操作で値の増減ができるjQueryプラグイン「jquery.stepper.js」

    jquery.stepper.jsは、マウス操作から手軽に値の増減を行…

最近の記事

  1. 三菱ブレッドオーブン
  2. 浜離宮恩賜庭園

アーカイブ

PAGE TOP