防止JQuery .click事件被激活，如果它是一个阻力？

Question

我有一个图像滑块，您可以单击并拖动图像以查看下一个图像。

我还有以下代码将启动＆＃34; FancyBox＆＃34;控制何时单击图像。

            $(".sliderimagefancybox").click(function(e) {
                var url = $(this).attr('src');
                var rel = $(this).attr('rel');
                var content = '<img src="' + url + '" rel="'+ rel + '" />';
                $.fancybox({
                    'transitionIn'  :   'elastic',
                    'transitionOut' :   'elastic',
                    'speedIn'       :   600, 
                    'speedOut'      :   200, 
                    'overlayShow'   :   false,
                    'content' : content
                });
            });

问题是，如果用户点击并拖动图像，并且仍然在图像上释放点击，则会触发上面的点击事件。

我如何才能忽略拖拽？

Answer 1

$(".sliderimagefancybox").on("mousedown", function(e) {

  this.tOut = setTimeout(function(){
    console.log("tOut");
    var content = '<img src="' + this.src + '" rel="'+ this.rel + '" />';
    $.fancybox({
      'transitionIn'  :   'elastic',
      'transitionOut' :   'elastic',
      'speedIn'       :   600, 
      'speedOut'      :   200, 
      'overlayShow'   :   false,
      'content' : content
    });
  }, 240);

}).on("mousemove", function(){

  clearTimeout( this.tOut ); // Don't activate fancybox if mousemoved

});