CODEWITHSUNDEEP
javascriptjquery
Mona Coder
Mona Coder

Reputation: 6316

How to add MouseDown event to a button

I have a button which is like below and a jQuery which increase the size of the slider perfectly:

<button id='plus' type="button">+</button>

$('#plus').click(function() {
     s.slider('value', s.slider('value') + s.slider( "option", "step" ) );   
 });

But I would like to change the size up as long as the mouse is down over the button. I tried this but it didn't do the job! (it is actually acting like click event).

$('#plus').mousedown(function() {
    s.slider('value', s.slider('value') + s.slider( "option", "step" ) );   
});

How can I do this in jQuery?

Upvotes: 0

Views: 161

Answers (3)

geevee
geevee

Reputation: 5451

i just understood that you want something to continuously happen while the button is pressed down.

see this answer,

the main idea is to start an interval when button is down, which will do the update on every round, and when the button is released, this interval will stop.

for example:

var timeout, clicker = $('#plus');

clicker.mousedown(function(){
    timeout = setInterval(function(){
        // Do something continuously 
        s.slider('value', s.slider('value') + s.slider( "option", "step" );
    }, 500);

    return false;
});

$(document).mouseup(function(){
    clearInterval(timeout);
    return false;
});

hope that helps.

Upvotes: 1

roman
roman

Reputation: 11278

as bind is deprecated using on should be the better solution:

$('#plus').on('mousedown', function() {
    s.slider('value', s.slider('value') + s.slider( "option", "step" ) );   
});

Upvotes: 0

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15767

Try

$('#plus').bind('mousedown', function() { s.slider('value', s.slider('value') + s.slider( "option", "step" ) );
});

OR

$('#plus').on('mousedown', function() { s.slider('value', s.slider('value') + s.slider( "option", "step" ) );
});

Upvotes: 1

Related Questions