Полноэкранная прокрутка карты google на сенсорных устройствах

Question

У меня есть страница контактов с картой google. Когда пользователь прокручивает карту, экран покрывает весь экран на мобильном устройстве.

Я хочу, чтобы пользователи могли прокручивать карту только при нажатии + перетаскивание, а не на простую прокрутку, чтобы пользователь мог прокручивать карту.

Любые идеи?

Answer 1

Два метода, которые я знаю, используя Hammer Js для обработки двойных кранов.

Один должен добавить наложение на карту и изменить его значение z-index по мере необходимости. Бонус с наложением заключается в том, что дополнительный код не требуется для отключения любого взаимодействия на карте, если это необходимо, например, щелчки маркеров и элементы управления.

предназначено для использования встроенной функции Gmaps .setOptions({draggable: true/false}.

Метод 1 Демо Примечание. Отрегулируйте ширину CSS, высоту, положение для карты (ы)

http://jsfiddle.net/gmqctmkd/

CSS

.overlay { 
position:absolute; 
height:300px; 
width:100%; 
background:transparent; 
z-index:99; 
top:0; 
left:0; 
} 

Код

mc.on("doubbletap", function(ev) { 

$(".overlay").css("z-index", "1"); 

}) 

Метод Два Демонстрационный Использование .setOptions({draggable: true/false}

http://jsfiddle.net/oom5uevt/

Код

// set map Options to disable drag. 

map.setOptions({draggable: false}); 

// enable drag 

mc.on("doubbletap", function(ev) { 

map.setOptions({draggable: true}); 

})