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

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

使用方法
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にある画像の通りです。
JavaScriptで独自マウスジェスチャーを作れる「jQuery Fancy Gestures」サンプル

sponsors

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

記事作成:
記事URL:

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