Question

i have a rather weird problem that should fix a bug in my current project. I’m working with a lot of thumbnails randomly positioned on the webpage. all thumbs have an absolute position.
this thumbs react on a hover set by jquery:

$(".thumb").hover(
  function () {
    $(this).stop().animate({"height": full}, "fast");
    $(this).css('z-index', z);
    z++;        
  },
  function () {
    $(this).stop().animate({"height": small}, "fast");
  }

so on hover they resize to a specific height.
Moreover all these thumbs are draggable via the jquery ui-draggable plugin.

I wonder if it is possible to UNBIND the hover of these thumbs if a thumb is currently dragged!

$( ".thumb" ).bind( "dragstart", function() {
      //$(this).draggable( "disable" );
      $(this).unbind('mouseenter mouseleave');
    });
    $( ".thumb" ).bind( "dragstop", function() {
        //$(this).draggable( "enable" );
        $(this).bind('mouseenter mouseleave');
    });

this is not working at the moment. I simply want to disable the hover event if i’m currently dragging a thumb. On dragstop the hover should work again.

Any idea how i could solve this? thank you

Answer 1

How about mousedown and mouseup.

$( ".thumb" ).bind( "mousedown", function() {
  //$(this).draggable( "disable" );
  $(this).unbind('mouseenter mouseleave');
});
$( ".thumb" ).bind( "mouseup", function() {
    //$(this).draggable( "enable" );
    $(this).bind('mouseenter mouseleave');
});

Although I’m not sure the purpose of your unbinding. There may be another way. Anyway, the mousedown and mouseup should trigger the start and stop of your drag.

Just remember, if a user does a normal click, the handlers will be bound and unbound every time.