Question

I want to create a jQuery control that allows me to view images (say; zoom in, out, move left, right, up, down, reset, etc.)

It works fine, but if I want to do something, I have to click buttons again many times (to zoom in e.g.) – so my idea was to bind the function as long as a button is clicked. So I could click the zoom in button and the image zooms in as long as I hold the button.

But I didn’t find any API docs on how to get the information if the button is clicked. There is no “clicked” attribute or something like it.

So, how can I do something as long as the button is clicked, repeatedly?

Answer 1

You could bind a handler for the mousedown event on the button.

This should call setTimeout which in turn should call the zoom function and another setTimeout.

Stop the timeout onmouseup.

var timer,
    zoom = function() {
        $('body').append('zoom <br />');
        timer = setTimeout(zoom, 25);
    }; 

$('button').mousedown(function() {
   timer = setTimeout(zoom, 25);
}).mouseup(function() {
   clearTimeout(timer);
});

DEMO

You probably have to adjust the times to your needs.