0

これを何と呼べばいいのかわかりません。思いつくのはリピーター ボタンだけです。

ボタンを押すと、MyZoom(InOrOut) などの関数がすぐに起動されます。

しかし、マウス ボタンを押したままにすると、マウス ボタンを離すまで、10 分の 1 秒ごとにその MyZoom(InOrOut) が発生し続けます。

関数名から推測できるように、ズームインとズームアウトの 2 つのボタンがあります。MyZoom(-1) を呼び出して小さくし、MyZoom(1) を呼び出して大きくします。

<button onclick="MyZoom(-1);">Zoom Out</button>
<button onclick="MyZoom(1);">Zoom In</button>

これを変更して、繰り返し効果を含めるにはどうすればよいですか?

4

2 に答える 2

2

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 プロパティを使用してボタンを識別します。

于 2012-04-21T12:27:00.277 に答える
1

これにはjQueryを使用します。mousedownと呼ばれるイベントと、それを行うのに役立つmouseupと呼ばれる別のイベントがあります。基本的に、mousedownイベントは、mouseupイベントが発生したときに停止するタイマーを開始(繰り返し)します。

あなたはこのようなものを持つことができます:

$('#myzoominbutton').mousedown(function() {
  alert('zooming is cool');
});
于 2012-04-21T12:29:47.960 に答える