Я пытаюсь реализовать MapBox на макет, который заполняет 100% страницы. Я отключил параметры масштабирования карты, но проблемы возникают при попытке прокрутки на сенсорных устройствах, где карта заполняет область просмотра. Могу ли я переопределить это или использовать браузер как изображение?MapBox прокрутка страницы при касании
ответ
Этот пример был усовершенствован: линия, которая хватает:
if (map.tap) map.tap.disable();
Это предотвратит карту от убийства крана событий на сенсорных устройствах.
Удалить остальных слушателей as in this example - тот, который у вас, вероятно, еще есть, есть dragging
.
Да, вы можете остановить слушатель MapBox от предотвращающих действий по умолчанию, установив функцию листовки не делать ничего:
L.DomEvent.preventDefault = function(e) {return;}
Чтобы удалить контур, расположенный вокруг элемента с помощью браузера, в противном случае был бы предотвратить, вы можете добавить:
*:focus {
outline: none;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
}
Это позволило прокрутить сенсорные устройства для меня, хотя я тестировал только на Android. Обратите внимание, что это может иметь другие последствия для вашего приложения - это, вероятно, можно предотвратить, перейдя в mapbox.js и удалив этот вызов только из тех слушателей, которые вам нужны.
Отлично! Это отлично работает для меня, однако у другого пользователя iPad теперь есть проблемы с использованием значков всплывающих подсказок. Они не останутся открытыми, если я не добавлю событие alert() click. Я застрял на пути, чтобы исправить это. – devlondoner
Это кажется чрезвычайно тяжелым. В основном вы полностью задействуете всю функциональность на карте. Существуют опции для управления каждым элементом, который вы, возможно, захотите отключить, оставив остальных работоспособными. – squarecandy
Для тех, кто хочет, чтобы динамически включить/отключить отображение окна прокрутки/масштабирование и т.д. в зависимости от размера страницы (как я), вы можете попробовать:
$(document).ready(function() {
$(window).on('resize', updateMap);
});
function updateMap() {
var width = $(window).width();
if (width < 768) {
map.scrollWheelZoom.disable();
map.doubleClickZoom.disable();
map.dragging.disable();
if (map.tap) map.tap.disable();
}
else {
map.scrollWheelZoom.enable();
map.doubleClickZoom.enable();
map.dragging.enable();
if (map.tap) map.tap.enable();
}
}
Заменить 768 соответствующим магическим числом для вашего макета. Предполагает jQuery.
попробуйте добавить
if (map.tap) map.dragging.disable();
Проблема с параметром dragging
в MapBox является то, что он контролирует как щелчок и удерживать перетаскиванием с помощью мыши или другого указывающего устройства и пролистывание движение сопротивления с помощью прикосновения. Не уверен, что какие-либо другие ответы проясняют это как главную проблему.
Сердце проблемы, с которой я думаю, что OP работает, заключается в том, что мы все любим перетаскивание мышью и считаем, что это просто использовать, но нам не нравится прикосновение, поскольку оно мешает прокрутите всю страницу.
Это строка кода, в которой я закончил использование. Это зависит от Modernizr и jQuery, но вы могли бы написать что-то подобное без них, если вам нужно.
// disable dragging the map on touch devices only
if ($('html').hasClass('touch')) map.dragging.disable();
- 1. Прокрутка страницы при касании перетаскивания холста
- 2. UIScrollView Вертикальная прокрутка при касании внутри subview
- 3. MapBox dragging.disable функциональных блоков прокрутка страницы на мобильном
- 4. Карта Mapbox неправильно отображается при загрузке страницы
- 5. Прокрутка не прокручивается при касании и удержании, а затем прокручивании
- 6. Прокрутка страницы посередине при загрузке
- 7. Отключить анимацию при касании CollectionView?
- 8. UIScrollView прыгает вниз при первом касании
- 9. Прокрутка страницы parallax при нажатии на навигационное меню (прокрутка Parallax)
- 10. Как отменить прокрутку при касании коснуться
- 11. Может светится при касании при касании вида в IOS?
- 12. jQuery горизонтальная прокрутка страницы
- 13. Прокрутка страницы при использовании перетаскивания HTML5 api
- 14. Прокрутка ViewPager's RecyclerView при прокрутке страницы
- 15. Прокрутка страницы при использовании Bootstrap и AngularJS
- 16. Функция триггера при обновлении страницы (бесконечная прокрутка)
- 17. Ненужная прокрутка вверху страницы при нажатии # link
- 18. Прокрутка страницы приложения Chrome
- 19. ACTION_CANCEL при касании
- 20. Удаление спрайта при касании
- 21. UITextField падает при касании
- 22. UITabBarItem растет при касании
- 23. Вибрация при касании
- 24. Удаление UIImageView при касании
- 25. Отставка клавиатуры при касании
- 26. Удаление SKSpriteNode при касании
- 27. Затухание UIButton при касании
- 28. UICollectionView Анимация при касании
- 29. UITextField падает при касании
- 30. Прокрутка страницы laggy
Это «отключает обработчик крана», как описано в [docs] (https://www.mapbox.com/mapbox.js/example/v1.0.0/disable-zooming-panning/) - не отключает перетаскивание карты на сенсорных устройствах OP спрашивает о – squarecandy