Why don't popovers, tooltips and modals work on the site when viewed through Ipad?

Question

css

Hello dear associates.
Such a problem. There is a site using the bootstrap framework of the second version.
The structure of the site is large and complex: a lot of pop-up elements (tooltips, popovers) and modal windows.
On desktop browsers everything works as it should. However, when viewing the site on the iPad, almost none of the elements work. Nothing happens when pressed.
I tried to watch through an emulator like: ipadpeek.com - everything is fine. And it doesn't work on the iPad.
Plus, on the iPad, there is a strange effect when you click on a link - at the moment you click it, it is painted over with a one-color rectangle.
What could be the reason?
Thanks in advance.

Answer 1

The trick is that on the iPad there is essentially no such event as MouseOver / Hover. There are Tap / Double Tap / Gestures events. Simply put, if your interaction is tied to pointing the mouse at objects, then the tablet does not understand this, because there is no pointing on it. Regarding the rectangle when clicked, this is most likely an attempt by the iPad to display the :hover / :active state. The first tap is an imitation of a hover event, the second tap is the actual transition by link.

Answer 2

Enable console on iPad:
and view JS errors