jquery - 单击并拖动鼠标然后将鼠标移出时，如何在鼠标移开时淡出？

当用户鼠标进入或鼠标离开可滚动区域时，我正在使用jQuery淡入和淡出tinyScrollBar。

我遇到的问题是，如果用户在滚动条手柄上单击并拖动，然后将鼠标释放到滚动条手柄上以外的任何位置，它会断裂并且不再淡入或淡出。

这是我尝试的代码...

$('#scrollbar1').tinyscrollbar({ size: 790, sizethumb: 100, wheel: 20, scroll: true });
$('.scrollbar').hide();

var mouseStillDown = false;

$('.thumb').mousedown(function() {
    mouseStillDown = true;
    console.log(mouseStillDown);
});

$('.thumb').mouseup(function() {
    mouseStillDown = false;
    console.log(mouseStillDown);
});


$('.viewport').mouseenter(
     function(){
         $('.scrollbar').fadeIn();
     }
);

 $('.viewport').mouseleave(
     function(){
         if (mouseStillDown == false) {
             $('.scrollbar').fadeOut();
         }
     }
);

And here's a link if it will help...

预先感谢您的任何反馈！

最佳答案

您可以在检查mouseStillDown = false;之前在mouseleave上设置mouseStillDown == false。
你可以试试看请提供反馈。