Google Maps v3 Распространение событий InfoBox в Mobile Safari

Question

Я создал инфобокс, используя google maps api v3 и infoBox из библиотеки утилит карт. Информационный блок содержит данные переполнения. Прокрутка работает точно так же, как и ожидалось на IE, FF, Chrome и Safari. Однако в мобильном Safari прокрутка вообще не работает. Это похоже на то, как будто информационный блок не обнаруживает прикосновения, чтобы начать прокрутку.

Я создал это jsfiddle , чтобы продемонстрировать проблему. Как вы можете видеть (в симуляторе iOS или на устройстве iOS), события mouseenter, touchstart, mouseleave и touchend запускаются просто отлично; просто нет способа прокрутить вниз, чтобы увидеть текст переполнения.

Я боролся с этим всю неделю. Любая помощь будет принята с благодарностью!

Answer 1

Я не знаю, является ли это ошибкой в ​​мобильном сафари (довольно вероятно), infobox.js или картах Google, но по какой-то причине прокрутка не будет работать внутри инфобокса в мобильном сафари, если распространение событий включеноэтот инфобокс.Прокрутка будет работать в других браузерах (FF, Chrome и настольный Safari), когда включено распространение событий.Кроме того, прокрутка прекрасно работает в мобильном сафари с отключенным распространением событий для инфобокса.

Итак, взлом, который я использовал для решения этой проблемы, состоял в том, чтобы просто определить, был ли клиент браузером iOS, а затем установить событиераспространение соответственно.Я знаю, что этот подход хакерский, но это было лучшее, что я мог придумать.См. fiddle для подтверждения того, что он работает как в мобильном сафари, так и в других браузерах.Также убедитесь, что вы используете самую последнюю версию infobox.js (1.1.11)

Answer 2

// For infobox
var myOptions = {
    enableEventPropagation: true
};
$(document).on("click touchstart", ".clickableclass", function() {
    // your function
});

Touchstart работал для меня