jQueryでフォームのselect要素をスタイリッシュに！ via：JQuery Narrative Select Plugin
selectってなんだか味気ないですよね。
そんな訳でJavaScriptライブラリのjQueryプラグインを使ったスタイリッシュにselectを変えてみましょう。
JQuery Narrative Select Plugin
使用方法
JQuery Narrative Select Pluginからファイル一式をダウロードします。
<link rel="stylesheet" href="jquery.narrativeselect.css" type="text/css" />
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.narrativeselect.js"></script>
<script type="text/javascript">
$(document).ready( function(){
$("select").narrativeselect({
tooltip_opacity : 0.80, // ツールチップ透明度（デフォ0.90）
tooltip_max_height : 300, // ツールチップ高さ（デフォ 200px）
});
});
</script>
あとは通常通りselectを記述すればあっという間に完成です。
<select>
<option value="correct">Correct</option>
<option value="incorrect">Incorrect</option>
</select>
jQueryでフォームのselect要素をスタイリッシュに！ via：JQuery Narrative Select Pluginサンプル
コメントする
記事作成：2010年5月18日 10:41
