mirror of
https://github.com/Hopiu/bootstrap.git
synced 2026-03-18 13:30:23 +00:00
* Replace backdrop with simple noop mouse listener As discussed in https://github.com/twbs/bootstrap/pull/22422 the current approach of injecting a backdrop (to work around iOS' broken event delegation for the `click` event) has annoying consequences on touch-enabled laptop/desktop devices. Instead of a backdrop `<div>`, here we simply add extra empty/noop mouse listeners to the immediate children of `<body>` (and remove them when the dropdown is closed) in order to force iOS to properly bubble a `click` resulting from a tap (essentially, method 2 from https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html) This is sufficient (except in rare cases where the user does manage to tap on the body itself, rather than any child elements of body - which is not very likely in an iOS phone/tablet scenario for most layouts) to get iOS to get a grip and do the correct event bubbling/delegation, meaning the regular "click" event will bubble back to the `<body>` when tapping outside of the dropdown, and the dropdown will close properly (just like it already does, even without this fix, in non-iOS touchscreen devices/browsers, like Chrome/Android and Windows on a touch laptop). This approach, though a bit hacky, has no impact on the DOM structure, and has no unforeseen side effects on touch-enabled laptops/desktops. And crucially, it works just fine in iOS. * Remove dropdown backdrop styles * Update doc for dropdowns and touch-enabled devices |
||
|---|---|---|
| .. | ||
| _data | ||
| _includes | ||
| _layouts | ||
| _plugins | ||
| about | ||
| assets | ||
| components | ||
| content | ||
| dist | ||
| examples | ||
| extend | ||
| getting-started | ||
| layout | ||
| utilities | ||
| .htmlhintrc | ||
| .htmllintrc | ||
| apple-touch-icon.png | ||
| browser-bugs.md | ||
| CNAME | ||
| favicon.ico | ||
| index.html | ||
| LICENSE | ||
| migration.md | ||
| robots.txt | ||
| search.json | ||