onmousedown
およびイベントを使用しonmouseup
ます。
でonmousedown
インターバルを開始し、で停止しonmouseup
ます。
jQuery を使用した小さな例を次に示します。
HTML:
<button class="zoomButton" data-zoom="out">Zoom Out</button>
<button class="zoomButton" data-zoom="in">Zoom In</button>
JavaScript:
var zoomIntervals = {};
$('.zoomButton').on('mousedown', function() {
var mode = $(this).data('zoom');
zoomIntervals[mode] = setInterval(function() {
// here you perform your action.
// check if mode == 'in' or mode == 'out' to determine if
// the user is zooming in or out
}, 100);
}).on('mouseup', function() {
var mode = $(this).data('zoom');
clearInterval(zoomIntervals[mode]);
del zoomIntervals[mode];
});
jQuery を使用しない (使用したくない) 場合は、使用addEventListener()
してイベントを登録し、データ プロパティに直接アクセスする (古いブラウザーとは互換性がありません) か、たとえば ID プロパティを使用してボタンを識別します。