Question

how to make the function work only after click button for one second?

eg

$("#button").click(function(){
$(".panel").addClass('flip');

I want 'flip' only if the button is pressed for 1 second. if you click on it for less than a second it does not 'flip'

Please suggest.

Answer 1

$(document).ready(function(){
  $("#button").mousedown(function(e){
    var self = this;
    clearTimeout(self.mouseUpTimer);
    self.mouseUpTimer = setTimeout(function(){
      $(self).bind('mouseup.delay', function(e){
        $(".panel").addClass('flip');
        $(self).unbind('mouseup.delay');
      });
    }, 1000);
  }).mouseup(function(e){
    clearTimeout(this.mouseUpTimer);
  });
});

jsFiddle: http://jsfiddle.net/zSPhK/