Question

I have the following code:

$(document).on('hover', '.tic_cont:not(.disabled_ticket)',function () {
        $(this).stop().find(".tic_icon").animate({ top: '-=16px' }, 250);
        $(this).stop().find(".ti_shd").animate({ opacity: '0.25' }, 250);
    }, function () {
        $(this).stop().find(".tic_icon").animate({ top: '+=16px' }, 250);
        $(this).stop().find(".ti_shd").animate({ opacity: '1' }, 250);
    });

When mouse over div it must go down, and when mouse leave go up. The problem in that the div always goes down. Where is a problem?
Thanks.
UPDATE:

In the debugger I saw that first function not calls.

Answer 1

$(document).on('mouseenter', '.tic_cont:not(.disabled_ticket)',function () {
    $(this).stop().find(".tic_icon").animate({ top: '-=16px' }, 250);
    $(this).stop().find(".ti_shd").animate({ opacity: '0.25' }, 250);
}.on('mouseleave', '.tic_cont:not(.disabled_ticket)', function () {
    $(this).stop().find(".tic_icon").animate({ top: '+=16px' }, 250);
    $(this).stop().find(".ti_shd").animate({ opacity: '1' }, 250);
});

Deprecated as of jQuery 1.8: The name “hover” used as a shorthand for the string “mouseenter mouseleave”. It attaches a single event handler for those two events, and the handler must examine event.type to determine whether the event is mouseenter or mouseleave. Do not confuse the “hover” pseudo-event-name with the .hover() method, which accepts one or two functions. http://api.jquery.com/on