将mouseenter / mouseleave结合到一个功能中

Question

考虑这两个工作职能。有没有办法将这两个字符串组合成一个jQuery函数？

$("#help").mouseenter(function(){
    $(this).animate({bottom: '+=100',});
});

$("#help").mouseleave(function(){
    $(this).animate({bottom: '-=100',});
});

Answer 1

请参阅http://api.jquery.com/hover/

$("#help").hover(function() {
    $(this).animate({
        bottom: '+=100',
    });
}, function() {
    $(this).animate({
        bottom: '-=100',
    });
});​

  

.hover（）方法为mouseenter和mouseleave绑定处理程序   事件。您可以使用它在行为期间简单地将行为应用于元素   鼠标在元素中的时间。致电$(selector).hover(handlerIn, > handlerOut)是：$(selector).mouseenter(handlerIn).mouseleave(handlerOut);

的简写

Answer 2

$("#help").on('mouseenter mouseleave', function() {

});

或者使用：

$('#help').hover(
  function() {
     // code for mouseenter 
     $(this).animate({bottom: '+=100',});
  },

  function() {
    // code for mouseleave
    $(this).animate({bottom: '-=100',});
  }
);