Прокрутка вызывает прокрутку страницы И масштаб карты в IE9 (Google maps v2)

Question

В Internet Explorer 9, используя API Карт Google v2 (что устарело), ​​масштабирование с помощью колеса прокрутки также приводит к прокрутке страницы. Кто-нибудь знает обходной путь для этой проблемы? (К сожалению, обновление нашей кодовой базы до версии 3 пока невозможно). Такое поведение не наблюдается в более ранних версиях Internet Explorer.

Вот тестовая страница .

Answer 1

Пожалуйста, попробуйте

$('#map').mouseover( function(){ 
    document.body.style.overflow = 'hidden';
    $('#wrap').css('margin-right','17px');
    console.log('mouse -> map , ' , document.body.scroll, ' / ' , document.body.style.overflow );   
} );

$('#map').mouseout( function(){ 
    document.body.style.overflow = 'auto';
    $('#wrap').css('margin-right','0px');
    console.log('mouse map -> , ' ,  document.body.scroll, ' / ' , document.body.style.overflow);  
} );

Этот код скрывает полосы прокрутки. Я обнаружил, что это единственный способ отключить прокрутку в IE. document.body.scroll = "no" не работает. (IE9)

#map - это div с картой Google, #wraper - это div со всей страницей. $('#wrap').css('margin-right','17px'); // только для того, чтобы сохранить ширину страницы, когда левая полоса прокрутки скрылась / показала

Answer 2

У многих людей, похоже, есть такая же проблема в сети, но я не нашел опубликованных решений. Так вот мое:

Поскольку компоненты без возможности прокрутки не вызывают событие прокрутки и это событие не может быть отменено в объекте документа, стандартный DOM не может быть использован. К счастью, есть небольшой плагин jQuery под названием «mousewheel», который добавляет в jQuery функции привязки событий «mousewheel» и «unmousewheel». Функция, вызванная событием mousewheel, может вернуть false, чтобы отменить ее, и документ не получит ее. Поэтому я проверяю IE9 или больше и загружаю этот маленький плагин, если необходимо, применяя его к div, содержащему карту.

Answer 3

У меня была такая же проблема, и я решил ее следующим образом: Когда курсор находится над элементом карты и колесо прокрутки перемещается, прокрутка всей страницы будет отключена. Только карта будет увеличивать или уменьшать

$('#map').live("mouseover",function() {
  $('#map').mousewheel(function(event) {    
  stopWheel(event);

  });
})

function stopWheel(e){
if(!e){ /* IE7, IE8, Chrome, Safari */ 
    e = window.event; 
}
if(e.preventDefault) { /* Chrome, Safari, Firefox */ 
    e.preventDefault(); 
} 
e.returnValue = false; /* IE7, IE8 */
}

Answer 4

Чтобы исправить эту проблему с PrototypeJS 1.7 (как предлагают Марек и theazureshadow), вы можете использовать в IE9:

$(gMapDiv).observe('mousewheel', function(event){
    event.stop();
});