onScroll（）在同一元素上禁用mouseenter（）

Question

我试图为同一个元素绑定两个事件处理程序，但是当触发onScroll（）时，mouseenter无法解决任何问题并解决这个问题？

   var main = function() {
  $(window).scroll(function() {
 if ($(window).scrollTop() > 900) {

$(".swap").delay(900).animate({
        opacity: 1, 
        marginRight: 0
    }, 'slow'
);
 }
  });
 $(".swap").mouseenter(function(){

  $(".swap").fadeOut('fast', function() {
    $(".swap-hidden").fadeIn("slow");
    $(".mobile p").last().append('and tablets')
  });
  });

  };
  $(document).ready(main);

Answer 1

这是因为mouseenter需要实际页面坐标（x和y）并且滚动会动态更改它们，因此您需要在每次滚动事件后重新绑定（或检查）mouseenter。

您的选择是：

1. 使用mouseenter切换hover。

2. 像这样重写你的函数（将你的mouseenter函数包含在document.ready函数中：

   var main = function() {
       $(window).scroll(function() {
           if ($(window).scrollTop() > 900) {
               $(".swap").delay(900).animate({
                   opacity: 1,
                   marginRight: 0
               }, 'slow');
           }
           $(".swap").mouseenter(function() {
               $(".swap").fadeOut('fast', function() {
                   $(".swap-hidden").fadeIn("slow");
                   $(".mobile p").last().append('and tablets')
               });
           });
       };
   });
   $(document).ready(main);