rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

Add iOS hack to tooltips

Browse Source 
Same hack as in https://github.com/twbs/bootstrap/pull/22426 (modulo the selector, which is wrong in that PR and will be updated in a separate PR) to get tooltips to work correctly on iOS. Dynamically adds/removes empty (`noop`) `touchstart` event handlers to all children of `<body>` in order to coax iOS into proper event delegation/bubbling
This commit is contained in:
Patrick H. Lauke 2017-04-20 13:49:35 +01:00 committed by GitHub
parent b4ac48fdec
commit ef099ad05d
1 changed files with 16 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
js/src/tooltip.js
View File

@ -304,6 +304,15 @@ const Tooltip = (($) => {
$(tip).addClass(ClassName.SHOW) $(tip).addClass(ClassName.SHOW)
// if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement &&
!$(parent).closest(Selector.NAVBAR_NAV).length) {
$('body').children().on('mouseover', null, $.noop)
}
const complete = () => { const complete = () => {
const prevHoverState = this._hoverState const prevHoverState = this._hoverState
this._hoverState = null this._hoverState = null
@ -352,6 +361,12 @@ const Tooltip = (($) => {
$(tip).removeClass(ClassName.SHOW) $(tip).removeClass(ClassName.SHOW)
// if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop)
}
this._activeTrigger[Trigger.CLICK] = false this._activeTrigger[Trigger.CLICK] = false
this._activeTrigger[Trigger.FOCUS] = false this._activeTrigger[Trigger.FOCUS] = false
this._activeTrigger[Trigger.HOVER] = false this._activeTrigger[Trigger.HOVER] = false
@ -368,6 +383,7 @@ const Tooltip = (($) => {
} }
this._hoverState = '' this._hoverState = ''
} }