エフェクト豊富なニュースティッカー用プラグイン「inewsticker」
「inewsticker」は、色々なエフェクトでニュースティッカーが実装できるjQueryプラグインです。ダウンロード
エフェクトには、fade/slide/typingの3つが可能です。
デモ
スクリプト
<script src="inewsticker.js" type="text/javascript"></script>
実装
<ul class="fade"> <li>ニュース1つ目</li> <li>ニュース2つ目</li> <li>ニュース3つ目</li> <li>ニュース4つ目</li> </ul> <!-- オプション --> <script type="text/javascript"> $(document).ready(function() { $('.fade').inewsticker({ speed : 3000, // テキストの切替時間 effect : 'fade', // エフェクト fade/slide/typing dir : 'ltr', // テキスト方向 ltr/rtl font_size : 13, // フォントサイズ color : '#000', // フォント色 font_family : 'arial', // フォント delay_after : 1000 // (?)effectが'typing'の場合の切替時間 }); }); </script>
その他
要素のclassやid(上の例では.fade)は、CSSのフレームワークなどと被ることがあるので表示されないときは、スタイルを確認してみて下さい。
Web-Ticker / jQuery Marquee / liScroll テキストが左右に流れる
JQuery Advanced News Ticker / vTicker テキストが上下に流れる
jQuery News Ticker
Dynamic News RSSフィードから取得して実装が可能
Airport / Text Effects / jQuery Ticker 空港のボーディングボードのようにテキストをパタパタ
Web-Ticker
<link href="webticker.css" type="text/css" rel="stylesheet"> <script src="jquery.min.js" type="text/javascript"></script> <script src="jquery.webticker.min.js" type="text/javascript"></script>
<ul id="webticker"> <li>My First News Item</li> <li>My Second News Item</li> <li>My Third News Item</li> </ul> <script type="text/javascript"> jQuery(function(){ jQuery('#webticker').webTicker(); }); </script>
Airport
<script src="jquery.min.js" type="text/javascript"></script> <script src="jquery.airport-1.1.source.js" type="text/javascript"></script>
<div id="airport"></div> <script type="text/javascript"> $("#airport").airport([ 'moscow1', 'berlin', 'stockholm' ]); </script>
関連記事
-
-
要素を折りたたみできる「nestedAccordion」
「nestedAccordion」は、クリックすると要素を開閉(折りたたみ)できるjQueryプラグインです。名前の通りネストして、アコーディオンの中にアコーディオンも実装できます。ダウンロードはこち
-
-
スワイプ対応の画像スライダー・ギャラリー用プラグイン
画像スライダー(ギャラリー)を作成してくれるjQueryプラグインの中からスワイプ操作で画像をスライドできるものをいくつか集めてみました。 シンプルでカスタマイズ豊富なスライダー用プラグイン「b
-
-
入力されたメールアドレスのドメインをサジェストしてくれる「mailcheck.js」
「mailcheck.js」は、入力されたメールアドレスのドメインをサジェストしてくれるjQueryプラグインです。 ダウンロード スクリプト 実装 v
-
-
Wysiwygエディタ用プラグイン「CKEditor」
「CKEditor」は、Wysiwygエディタを実装できるプラグインです。 ダウンロード | デモ スクリプト 実装 文字数・単語数のカウント表
-
-
ポップアップ・モーダル ウィンドウ プラグイン
ポップアップ シンプルにポップアップを実装できる「PopBox」 実装方法が選べるツールチップ用プラグイン「Smallipop」 Bootstrap Popovers
-
-
シンプルにモーダルウィンドウを実装できる「leanModal」
「leanModal」は、シンプルにモーダルウィンドウを設置できるjQueryプラグインです。オプションは少なめですが、複雑な機能は必要なく単に設置したいという場合にはもってこいのライブラリだと思いま
-
-
レスポンシブに対応した画像ギャラリーが実装できる「Responsive Image Gallery」
「Responsive Image Gallery with Thumbnail Carousel」はレスポンシブにも対応した画像ギャラリーが実装できるjQueryプラグインです。Twitterの「最
-
-
マウスオーバーすると画像にキャプションを表示してくれる「Mosaic」
「Mosaic」は、画像などにマウスオーバーすると、キャプションをスライド(イン/アウト)もしくはフェイド(イン/アウト)させてくれるjQueryプラグインです。ダウンロードはこちら スクリプト
-
-
マウスオーバーでキャプション表示してくれる プラグイン
画像マウスオーバーするとキャプションを出現させるプラグイン (jQuery 1.10.2で動作確認のできたものに限定しています。デモ一覧) imgタグの#alt属性から自動でキャプションを生成
-
-
タブを画面サイズによってアコーディオンにしてくれる「Easy Responsive Tabs to Accordion」
「Easy Responsive Tabs to Accordion」はタブ表示を画面サイズによって折りたたみのアコーディオン形式に変換してくれるjQueryプラグインです。 デフォルトでは、768
Comment
マーキータグが非推奨って知りませんでした。 / “jQuery | エフェクト豊富なニュースティッカー用プラグイン「inewsticker」” (4 users) https://t.co/rCCjUWPfNn
マーキータグが非推奨って知りませんでした。
inewsticker
ティッカーの動きいろいろ
https://t.co/C4VnzOh7DI
jQueryでカンタン「ティッカー」(エフェクト豊富なプラグイン) - NAVER まとめ
http://matome.naver.jp/odai/2140671372556298601