PreViewTube.js

JavaScript

YouTubeのサムネイル画像をアニメーション表示してくれる「PreViewTube.js」

PreViewTube.jsはYouTubeにある動画のサムネイル画像をアニメーション付きで表示させることができるjQueryプラグインです。動画を見るか見ないかを決める際のちょっとした判断材料として活用できますね。

PreViewTube.js

デモ

デフォルトではサムネイル画像にマウスオーバーするとアニメーションが開始されます。連続した画像が一定の間隔で切り替わっていくので、ザックリとどういった内容なのかを確認するにはピッタリですね。

オプション項目のmodeをconstantに設定すると常時アニメーションが流れるようになります。スピード(間隔)を調節したい場合はintervalに任意の数値を指定すればOKです。

以下はmodeをconstant、intervalを500に設定した時の使い方です。

$('.someSelector').PreViewTube({
    'interval' : 500,
    'mode' : 'constant'
});

jQuery本体とPreViewTube.jsは予め読み込んでおく必要があります。あとはYouTubeのサムネイルを記述するだけで簡単に表示させることができます。

PreViewTube.js

関連記事

  1. Radial SVG Slider

    JavaScript

    放射状に切り替わるスライダーを実装できる「Radial SVG Slider」

    Radial SVG Sliderは、放射状に広がりながら切り替わるス…

  2. ScrollPress

    JavaScript

    スムーズなアニメーションのスクロールトップ実装「ScrollPress」

    ScrollPressは、スムーズなアニメーションによるスクロールトッ…

  3. Bootstrap Photo Gallery jQuery plugin
  4. mgGlitch

    JavaScript

    グリッチ効果を付けれるjQueryプラグイン「mgGlitch」

    mgGlitchは、CSS3の変換を利用して指定した要素にアニメーショ…

  5. Spring Loaders

    JavaScript

    ポリゴンによるローディングアニメーションがかっこいい「Spring Loaders」

    Spring Loadersはポリゴンでつくられたローディングアニメー…

  6. GRT Responsive Menu

最近の記事

  1. SOL001
  2. 末廣ラーメン
  3. ナッティホワイトチョコレートフラペチーノ

アーカイブ

PAGE TOP