开发中遇到一个问题,期望滚动地图区域实现地图缩放,滚动地图区域之外实现滚动栏滚动。 实现思路:
- 监听滚动事件
- 判断当前鼠标停留的位置
- 如果鼠标悬停在地图区域,则将滚动栏参数值置为-1
$(function () {
// 鼠标进入到区域后,则存储当前window滚动条的高度
var scrollTop = -1;
$('body').hover(function(event){
scrollTop = $(window).scrollTop();
}, function(event){
scrollTop = -1;
});
// 鼠标进入到区域后,则强制window滚动条的高度
$(window).scroll(function(event){
let flag = $("#baidumap").is(':hover');
if(flag){
scrollTop!==-1 && $(this).scrollTop(scrollTop);
}
})
})