クリックしたら、何かが起こる仕掛けはよく使われますが、ダブルクリックや右クリック（＝コンテクストメニュー）でも発動させることが可能です。
マウスの場合、クリックは基本的に押して、離してから発動しますが、押された瞬間も検知可能です。
カーソルが要素の上を通過することも検知できます。
応用すると、押されて、動いて、離すと、マウスは「ドラッグ」、スマホだと「スワイプ」や「フリック」となります。
カーソルをここに合わせると実行します
上記の青い部分にマウスを合わせると、ブラウザの開発ツールのコンソールに、以下の記述が出力されます。
ソースはこちら
$(function(){
$('#hoge').on('click', function(e) {
console.log('クリック');
});
$('#hoge').on('dblclick', function(e) {
console.log('ダブルクリック');
});
$('#hoge').on('contextmenu', function(e) {
console.log('右クリック');
});
$('#hoge').on('mousedown', function(e) {
console.log('マウスが押された瞬間');
});
$('#hoge').on('mousemove', function(e) {
console.log('ドラッグされた');
});
$('#hoge').on('mouseup', function(e) {
console.log('マウスが離れた瞬間');
});
});
