Adobe Indesign - наложение веб -контента - предотвратить пузырьки событий прокрутки

StackOverflow https://stackoverflow.com/questions/19834729

Вопрос

У меня есть журнал Indesign, который содержит наложение веб -контента (указывая на адаптивный веб -сайт). Все работает отлично, кроме того, когда дело доходит до прокрутки.

Требуется только вертикальная прокрутка (вверх и вниз), горизонталь нет.

Проблема

Когда пользователь пробирается влево или вправо, страница журнала меняется, и веб -контент закрывается.

Вопрос

Есть ли способ, которым я могу предотвратить распространение событий прокрутки в журнале из наложения веб -контента? Предпочтительно, это будет сделано из самого веб -контента (например, с использованием JavaScript), так как это будет означать, что мне пришлось бы редактировать только в одном месте, а не на каждой странице отображается веб -контент.

Попытка

  • Поймать touchmove Событие на теле страницы и призыв stopPropagation() в теме.
  • Вызов preventDefault() На мероприятии (это вообще останавливает любую прокрутку).
  • Использование Pagex On touchmove События и призыв preventDefault() На любых, которые выглядят горизонтальными ударами (слишком ненадежными).
  • Используя CSS overflow-x: hidden
  • jQuery Mobile's Custom Scroll Events.
  • Еще несколько комбинаций вышеизложенного.
Это было полезно?

Решение

Нашел решение. Во -первых, вставьте <meta> viewport тег в голове:

<meta name="viewport" content="width=701, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0, user-scalable=no" />

Обратите внимание, что я установил статическую ширину 701, это важно. Ширина наложения веб -контента 700px. Анкет Установка ширины 701 означает, что страница может немного двигаться немного. Это покачивает, что удары влево/справа пойманы и не просачиваются до Indesign. Существует небольшой сдвиг (по пикселю), если они проведут, но это незначительно по сравнению с изменяющейся страницей.

Затем добавьте следующий CSS в ваш контент:

.content {
    -webkit-overflow-scrolling: touch
}

Вам может не понадобиться этот CSS, но это было необходимо для нас.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top