bingmap焦点时如何禁用滚动？

我有一个bingmap它的宽度和高度比父div更多。然后Prent公司格设置为滚动，bingmap焦点时如何禁用滚动？

“上下滚动时Prent公司滚动条，点击bingmap，突然父滚动到顶部位置”

“或滚动至底部，然后单击bingmap外点击里面可以看到滚动条滚动到顶部“

如何可解这个效果怎么样？

<div style="overflow: auto; width: 400px; height: 200px;"> 
 
    <div id='myMap' style='width: 100vw; height: 200vh;position: relative;'></div> 
 
</div> 
 
<script type='text/javascript'> 
 
    var map; 
 

 
    function loadMapScenario() { 
 
    map = new Microsoft.Maps.Map(document.getElementById('myMap'), { 
 
     credentials: '' 
 
    }); 
 
    } 
 
</script> 
 

 
<script type='text/javascript' src='https://www.bing.com/api/maps/mapcontrol?callback=loadMapScenario' async defer></script>

来源

2017-07-26 azad

你为什么将一个滚动/缩放地图包装在一个较小的容器中的任何原因？这不是很好的用户体验。 – DarthJDG

@DarthJDG实际上我的地图高度比查看端口高度要大，因此当用户滚动到地图底部并点击它时，它会突然滚动。 – azad

似乎只发生在第一次点击。正如DarthJDG所提到的，这看起来像是一个奇怪的用户体验，它具有可滚动div内的地图。 – rbrundritt

最后我添加了一个补丁放到我的代码。恢复父母（我的案例window）滚动位置到上一个位置。当鼠标停在地图上时，逻辑保存滚动位置并在窗口滚动时恢复。

var scrollPositionY = -1; 
Microsoft.Maps.Events.addHandler(map, 'mousedown', function(e){ 

    scrollPositionY = document.documentElement.scrollTop || document.body.scrollTop; 

    $(window).bind('scroll',preventWindowScroll); 
    setTimeout(function(){ 
     $(window).unbind('scroll',preventWindowScroll); 
    },100); 
}); 

function preventWindowScroll(e){ 
    window.scrollTo(0,scrollPositionY);//restore to saved position 
    e.preventDefault(); 
    return false; 
}

来源

2017-07-27 05:49:16 azad

bingmap焦点时如何禁用滚动？

回答

相关问题