Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Which browsers are supported #66

Closed
drnkwati opened this issue May 29, 2017 · 5 comments
Closed

Which browsers are supported #66

drnkwati opened this issue May 29, 2017 · 5 comments
Labels

Comments

@drnkwati
Copy link

You should include browser support.

@cthedot
Copy link

cthedot commented Oct 9, 2017

As far as I deduce from the CSS the vendor prefixed properties support goes back to IE6 or so but even if removing all the "old" prefixes like kthml- and the IE filters support would still be like almost all browsers at least for opacity http://caniuse.com/#search=opacity

There are data URL (SVG?) background images which are not supported in older browsers though.

And less support for the also used "pointer-events" property http://caniuse.com/#search=pointer-events . Guess prefix support for opacity, transform transition should be aligned with pointer-events (have not checked all the CSS, might make sense to keep some prefixed properties).

But this would make browser support a bit clearer while reducing the CSS quite a bit, as an example:

filter: alpha(opactiy=0);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
-webkit-transition: all 0.18s ease-out 0.18s;
-moz-transition: all 0.18s ease-out 0.18s;
-ms-transition: all 0.18s ease-out 0.18s;
-o-transition: all 0.18s ease-out 0.18s;
transition: all 0.18s ease-out 0.18s;

would become

opacity: 0;
-webkit-transition: all 0.18s ease-out 0.18s; /* maybe keep this? */
transition: all 0.18s ease-out 0.18s;

Maybe this is too aggressive but personally I would even loose the -webkit- properties as stuff would work without these but would look a little bit less polished which on these devices probably does not matter much (IMHO).

I have not tested extensively but e.g. I think balloons would work in IE9 without all the filters. The website does not work in IE8 (emulated only) at all so hard to say if that would work at all. Even more reason to loose filter properties and old prefixes.

@cthedot
Copy link

cthedot commented Oct 9, 2017

have not tested it but what actually about touch support? Hover if at all probably won't work on all devices/OS varieties?

@kazzkiq
Copy link
Owner

kazzkiq commented Oct 9, 2017

@cthedot It works on both Android (Chrome) and iOS 8+.

iOS has a quirk where you can't "click away" to close the tooltip. The only way to close it is tapping in other element with focus. But its not a blocking bug. #60 has more info on it.

@cthedot
Copy link

cthedot commented Oct 9, 2017

Guess problem on touch devices is mostly discoverability. If on a button or link I'd click the button but not "long click" to hover. With mouse it is instant even before any click. But that is not specific to your code, just a general problem with hover based stuff I guess.

BTW, the "long click" also works on Windows (tested on Lumia 950 Win Mobile 10 but guess tablet with Edge too)

@kazzkiq
Copy link
Owner

kazzkiq commented Jun 14, 2019

From v1.0 on those are the browsers we aim to support:

Desktop:

  • Safari (Webkit)
  • Chrome (Blink)
  • Firefox (Gecko)

Mobile:

  • Chrome/Android (Blink)
  • Safari/iOS (Webkit)
  • Firefox/Android (Gecko)

Any other browser that relies on those rendering engines should work just fine, but is not in the list for immediate fixes if something breaks.

@kazzkiq kazzkiq closed this as completed Jun 14, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants