Клуб API Карт

Прокрутка карты на touch устройствах

Пост в архиве.
svirshchevskiy
10 февраля 2014, 18:56

Проблема следующая:

На адаптивном сайте, при прокрутке страницы возникает ситуация, когда прокрутка невозможна из-за того что страницу перекрывает карта.

Т.е. прокручиваем страницу до карты, пытаемся докрутить до конца, но палец попадает на карту и скроллит ее.

Какие есть решения этой проблемы (средствами api)? 

Версия карты: последняя бета.

7 комментариев
Либо оставлять полосу свободного места справа-слева от карты, либо отключать мультитач.

Спасибо!

так отключаются мультитач жесты

map.behaviors.disable('multiTouch');

а так перетаскивание карты

map.behaviors.disable('drag');

А что, получается нельзя отключить перетаскивание карты только с тач устройств? Потому что на компьютере такой проблемы нет, пусть таскают, там главное, если карта во всю ширину окна, отключить зум по скроллу колесом. А вот на тач устройствах возникает затык в прокрутке из-за этого.

www.huliotebenado,
можно определить тип устройства самостоятельно и на основе этого отключать или не отключать перетаскивание.
www.huliotebenado,


Здесь подробно описано как реализовать. Все работает.
Александр,
Не работает ссылка
shamandigital,
 Насколько я помню там был вот такой код


var isMobile = {
Android: function () {
return navigator.userAgent.match(/Android/i)
},
BlackBerry: function () {
return navigator.userAgent.match(/BlackBerry/i)
},
iOS: function () {
return navigator.userAgent.match(/iPhone|iPad|iPod/i)
},
Opera: function () {
return navigator.userAgent.match(/Opera Mini/i)
},
Windows: function () {
return navigator.userAgent.match(/IEMobile/i)
},
any: function () {
return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows())
}
}
if (isMobile.any()) {
map.behaviors.disable('drag')
}

Но я придумал еще один вариант решения - можно при загрузке страницы проверять высоту окна браузера, и если оно меньше высоты карты заданной в стиле по-умолчанию,  то сделать размер окна карты, например, 0.6 от высоты  окна. Например так


mapHeight () {
  let tmp = '750px'
  let h = document.documentElement.clientHeight
  if (h < 750) {
    tmp = (h * 0.6) + 'px'
  }
  return tmp
}

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