2 つの EventListener を追加して、スクロールを制御し、(特に) Chrome で滑らかで滑らかにします。これは、デフォルトでは恐ろしい動作をします。
if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;
var time = 1300;
var distance = 270;
function wheel(event) {
if (event.wheelDelta) delta = event.wheelDelta / 120;
else if (event.detail) delta = -event.detail / 3;
handle();
if (event.preventDefault) event.preventDefault();
event.returnValue = false;
}
function handle() {
$('html, body').stop().animate({
scrollTop: $(window).scrollTop() - (distance * delta)
}, time);
}
$(document).keydown(function (e) {
switch (e.which) {
//up
case 38:
$('html, body').stop().animate({
scrollTop: $(window).scrollTop() - distance
}, time);
break;
//down
case 40:
$('html, body').stop().animate({
scrollTop: $(window).scrollTop() + distance
}, time);
break;
}
});
Google Maps API v3 マップを追加する必要があることを除いて、すべてが完全に機能しています。また、マウスがマップ上にあるときにマウス ホイールを使用するとズームインおよびズームアウトする別の EventListener があります。マウスがマップ上にあるときにスクリプトを無効にするにはどうすればよいですか? これが私のページへのリンクです(動作を確認できます)、ライブ:http://www.rendezvousroma.it/new/contatti.php