[jQuery] FlickerPlateを紹介します。
公開日：
:
jQuery, Web制作 HTML, javascript, jQuery
かっこいいプラグインで、フリックにも対応します。
Flickerplateは、シンプルでとても使いやすいjQueryプラグインです。
導入方法
まずは、jsやCSSの読み込みです。
<head> // Required javascript <script src="js/min/jquery-v1.10.2.min.js"></script> <script src="js/min/modernizr-custom-v2.7.1.min.js"></script> <script src="js/min/jquery-finger-v0.1.0.min.js"></script> // Flickerplate <script src="js/min/flickerplate.min.js"></script> <link href="css/flickerplate.css" rel="stylesheet" type="text/css"> </head>
今回は、タッチ検出にmodenizrとタッチイベントにjQuery-fingerを必要としてます。
続いてHTMLです。
<div class="flicker-example"> <ul> <li> <div class="flick-title">Title 1</div> <div class="flick-sub-text">Text line 1</div> </li> <li> <div class="flick-title">Title 2</div> <div class="flick-sub-text">Text line 2</div> </li> <li> <div class="flick-title">Title 3</div> <div class="flick-sub-text">Text line 3</div> </li> </ul> </div>
このように、今回はflicker-exampleを付けた中身が該当します。
最後に、実行文です。
<script>
$(document).ready(function()
{
$('.flicker-example').flicker();
});
</script>
これで完成です。
もっと詳しく知りたい方は下記を参考にしてみてください。
Flickerplate plugin
まとめ
かけ足で紹介しましたが、いかがでしたでしょうか？
シンプルなので、使い勝手は悪くないと思います。
気になった方は是非使ってみてください。
ad
関連記事
-
-
[HTML] 初心者を脱却するためのHTMLの心構え！
デザインを見たら、まずレイアウトの方法をイメージしよう 僕は、基本的にデザインを頂いたときに、すぐ
-
-
[CSS] ベンダープレフィックスはどこまで必要か？
各ブラウザが独自に先行実装しているCSS3 CSS3が現在、各ブラウザでも対応状況が進み、だいぶ使
-
-
[Dreamweaver] オプション領域を極める！テンプレート上級編
オプション領域は、難しい！ これまで、数回に渡りDreamweaverでのテンプレートの使い方を紹
-
-
[WordPress] 自作プラグインの設定など
プラグインを自作してみる WordPressでプラグインを作成する際の設定(フック)などをまとめて
-
-
[javascript] Google Maps javaScript API v3の使い方（応用編：マーカーを変更する）
いろんなことが出来るようになったv3 昨日、基本編を書きましたが、今回は応用編です。 v3に
-
-
[jQuery] Block Scrollプラグイン
今回は、ブロック毎にスクロールするjQueryプラグインのご紹介です。 Block Scroll
-
-
[CSS] clearfixの使い方を考える
現在のclearfix 以前は、IE6に対応させるためにソースがちょっと多かったですが、現在はかな
-
-
[WordPress] 管理画面にカラーピッカー(wp_color_picker)を表示する
カラーピッカー 管理画面でプラグインの設定などでカラーピッカーを表示したい場合、wp_color_
-
-
[CSS] CSSで作るリストのアイコン
CSSだけでも色々出来る！ CSS3が現在の最新ブラウザでは大体対応されてきてますので、色々な表現
-
-
[html5] おさらいがてらWordPressのテーマを作るためにHTML5で一から作るよ！[第2回]
忙しくて忘れてました。僕です。 さて、今回はもうちょっと見栄えもよくしたいなーなんて考
