vTicker

JavaScript

シンプルで使い方も簡単!垂直ティッカーを実装できるjQueryプラグイン「vTicker」

シンプルで使い方も簡単な垂直ティッカーを実装できるjQueryプラグイン「vTicker」をご紹介します。ulのli要素に表示させるテキストを記述していき、vTickerをセットアップするだけです。スペースを有効活用したい時や、ちょっとした導線をつくりたい時によさそうですね。

[ads_center]

使い方

このようにli要素に表示させたいテキストを記述していきます。ティッカーはli要素ごとに切り替わっていきます。

<div id="sample">
    <ul>
        <li>サンプルテキスト1</li>
        <li>サンプルテキスト2</li>
        <li>サンプルテキスト3</li>
    </ul>
</div>

あとはvTickerをセットするだけです。

$(function() {
    $('#sample').vTicker();
});

オプションも色々あり、スピードやアイテムを表示させる数を指定することもできます。CSSで見た目をカスタマイズしたりすれば色々と応用が効きそうですね。

vTickerのダウンロードや詳細については以下の公式サイトで確認することができます。

MacのアクティビティモニタMacで現在のメモリ使用量や空き容量を管理・確認したい場合はアクティビティモニタが便利前のページ

iPhoneでコピペを多用する人に便利なクリップボード履歴が分かるアプリ「Clipboard Manager and History」次のページ

関連記事

  1. jQuery Waterwheel Carousel

    JavaScript

    水平や垂直方向に配置できる水車のような便利なカルーセル「jQuery Waterwheel Caro…

    水平方向や垂直方向に配置できる水車のような便利なカルーセル「jQuer…

  2. multi-list

    JavaScript

    複数の選択可能なリストにするためのjQueryプラグイン「multi-list」

    multi-listは、順序付けされていないリストを複数の選択可能なリ…

  3. gridstack.js

    JavaScript

    ウィジェットレイアウトを作成できるjQueryプラグイン「gridstack.js」

    gridstack.jsはドラッグ&ドロップでウィジェットレイアウトを…

  4. Multi-Level Menu

    JavaScript

    流れるような遅延アニメーションが美しい階層化メニュー実装「Multi-Level Menu」

    Multi-Level Menuは流れるような遅延アニメーションが美し…

  5. SPOILER ALERT!

    JavaScript

    画像やテキストにボカシを入れることができるjQueryプラグイン「SPOILER ALERT!」

    画像やテキストといった部分にボカシを入れることができるjQueryプラ…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. DCG-CA21
  2. Apple WatchでのMacロック解除を無効
  3. オータムスイートポテトフラペチーノ
  4. 紅葉
  5. ナノケア EH-NA0E

アーカイブ

PAGE TOP