Почему не работают поповеры, тултипы и модальные окна на сайте при просмотре через Ipad?

Question

[Artem Kom]

Здравствуйте, уважаемые сообщники.
Такая проблема. Есть сайт, использующий фреймворк bootstrap второй версии.
Структура сайта большая и сложная: много всплывающих элементов (тултипов, поповеров) и модальных окон.

На десктопных браузерах все работает как надо. Однако при просмотре сайта на IPad не работает практически ни один элемент. При нажатии ничего не происходит.

Пробовал смотреть через эмулятор типа: ipadpeek.com - все отлично. А на IPad не работает.

Плюс на IPad странный эффект при нажатии на ссылку - в момент нажатия она закрашивается одноцветным прямоугольником.

В чем может быть причина?
Заранее спасибо.

Answer 1

[Игорь Воротнёв]

Фокус в том, что на iPad по сути отсутствует такое событие как MouseOver / Hover. Там есть события Tap / Double Tap / Gestures. Проще говоря, если у вас взаимодействие завязано на наведение мышкой на объекты, то планшет этого не понимает, ибо на нем наведения нету. По поводу прямоугольника при клике - это, скорее всего, и есть попытка айпада отобразить состояние :hover / :active. Первый тап - имитация события наведения, второй тап - собственно переход по ссылке.

Comments

[Artem Kom]

Спасибо что откликнулись. А не подскажите как прописываются тогда события типа Tap / Double Tap / Gestures или ссылочку где есть про такое

[Ольга Стогова]

Дело в том, что при разработке сайтов, следует учитывать, что на тач-устройствах нет :hover, и либо вообще не использовать эти эффекты на сайте, либо для тача делать отдельные эффекты на клик

Answer 2

[Александр Хиренко]

Включите консоль на iPad:
"Settings" -> Safari -> Developer Debug Console (on)
и просмотрите ошибки JS

Comments

[Artem Kom]

спасибо за совет. Попробую вечером. Как я понял Айпад кабелем нужно к компьютеру подсоединять....