mdbootstrap / bootstrap-hover-dropdown

An unofficial Bootstrap plugin to enable Bootstrap dropdowns to activate on hover and provide a nice user experience.
http://cameronspear.com/demos/bootstrap-hover-dropdown/
MIT License
1.26k stars 503 forks source link

Hover is not working in Chrome Version 47.0.2526.80 m #141

Open Itumac opened 8 years ago

Itumac commented 8 years ago

Try your demo page in Chrome 47.0.2526.80 m https://cameronspear.com/demos/bootstrap-hover-dropdown/

There are no console errors. It works as expected in IE 11

Itumac commented 8 years ago

It appears the ontouchstart catch in the init function is getting called in (this version?) of chrome.

if('ontouchstart' in document) return this;

CWSpear commented 8 years ago

It works for me. I assume you're on Windows? Is your computer touch-enabled? This may be related to the infamous #68

CWSpear commented 8 years ago

I guess that doesn't make sense if it works in IE11...

Itumac commented 8 years ago

I'm on Windows 7 enterprise. No special machine. Suspiciously like #68

I changed the line to

if(window.DocumentTouch && document instanceof DocumentTouch) return this;

as found on SO. hover work in chrome and in tap in the mobile emulation mode. But its early moments of testing.

whitneyland commented 8 years ago

Here's why this is broken: Chrome has started supporting ontouch events in all versions of the browser so the existing check for mobile does not work anymore and always returns true (if('ontouchstart' in document) return this;).

The reason Chrome can do this is because the CSS working group standardized media queries as the proper way to detect this. All the latest browser versions now support this standard.

For more information, this is how it should be properly done now: https://drafts.csswg.org/mediaqueries-4/#mf-interaction

stormisover commented 7 years ago

Also met the some issue. If this plugin does not work well on mobile browser, I suggest detecting the device type by navigator.userAgent.