skuare.net

JavaScriptライブラリjQueryのサンプルを中心にWebサイト構築に役立つ情報を紹介

iPhoneライクに数字をスクロールさせるJavaScript「mobiscroll」

iPhoneの数字スクロールはインターフェースが変わり、設定すら楽しいUIになります。
これをjQueryで実現したmobiscrollを紹介します。

sponsors

使用方法
mobiscrollからファイル一式をダウンロードします。
<link href="jquery.scroller-1.0b.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery.scroller-1.0b.js" type="text/javascript"></script>
<script>
$(function () {
$('#id名').scroller();
});
</script>

あとは上記idをinputに付与すれば完成です。
<input type="text" id="id名" class="genField textEntry date" readonly="readonly" />

iPhoneライクに数字をスクロールさせるJavaScript「mobiscroll」サンプル

sponsors

「iPhoneライクに数字をスクロールさせるJavaScript「mobiscroll」」をシェアする

記事作成:
記事URL:

TOP > > > iPhoneライクに数字をスクロールさせるJavaScript「mobiscroll」

前の記事:
次の記事:クリック時にリストを華麗に表示!jQueryプラグイン「mobilyblocks」

あなたにはこちもお勧め!

jQuery プラグインまとめ!

JavaScript

read more

Column

read more