マウスホイールでもスライドするJavaScript「horinaja for scriptaculous or jQuery」

最近のマウスにはホイールがついていることも多いので、スライドさせるJavaScriptでもこれが使えると便利です。
horinaja for scriptaculous or jQueryではこれをjQueryまたはscriptaculousで実現可能です。
今回はjQueryで。

sponsors

使用方法

horinaja for scriptaculous or jQueryからclass.horinaja.jquery.js、horinaja.cssをjQueryからjquery.js、MOUSE WHEEL EXTENSIONからjquery.mousewheel.jsをダウンロードします。

<script src="jquery-1.3.2.js" type="text/javascript"></script>
<script src="jquery.mousewheel.js" type="text/javascript"></script>
<script src="class.horinaja.jquery.js" type='text/javascript'></script>
<link rel="stylesheet" href="horinaja.css" type="text/css" media="screen" />
<script language="javascript" type="text/javascript">
$(function() {
	$('#id名').Horinaja({
		capture:'id名',
		delai:0.3, //次に移る速度
		duree:4, //次に移る時間
		pagination:true //ページネーション
	});
});
</script>
あとは以下のように記述すれば完成です。

<div id="id名" class="horinaja">
	<ul>
		<li>content 1</li>
		<li>content 2</li>
		<!-- 以下個数分 -->
	</ul>
</div>

サンプル


Javascriptサンプルページ一覧
skuare.net

sponsors