JavaScriptで独自マウスジェスチャーを作れる「jQuery Fancy Gestures」

マウスを一定の方向に動かすことにより、特定の動作をさせるマウスジェスチャー。
jQuery Fancy Gesturesでは、これをオリジナルで作ることができます。

sponsors

使用方法

jQuery Fancy Gesturesからファイル一式をダウンロードします。

<script type="text/javascript" src="wz_jsgraphics.js"></script>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.fancygestures.js"></script>
<script>
$(document).ready(function() {
	$('#id名').fancygestures(function (data) {
		document.getElementById('id名2').innerHTML += data;	
	});
});
</script>
上記で指定したidを書けば完成です。
<div id="id名"></div>
<div id="id名2"></div>//ここに表示されます

オリジナルを作るにはjquery.fancygestures.jsの40行目からのものに追記する必要があります。
gestures["skuare.net!"] = "51";
このように書くと左上から右下にマウスを動かした時にskuare.net!と表示されます。
※数字はjQuery Fancy Gesturesにある画像の通りです。

サンプル



sponsors

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