- Sliding menu from https://miketaylr.com/misc/exercises/slider.html does not work in Firefox or Safari. Works in Chrome
- Watched the console for clues, none forthcoming
- Examined the CSS and click event handler for obvious coding issues, initially looks good
- Tinkered with the css a bit based on some related issues found in stackoverflow having to do with display:block in LI and A nodes - was a red herring
- Created a simpler test case, see: https://gist.github.com/daviddahl/a6740c9310d15452b28fac79cbc93b6a
- Looked at the MDN article on transform/translate3d: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions - notinced there are no prefixes for gecko!
- Removed the
-moz-
prefix for both in the CSS and the script in my version. Now, it works in Firefox. - Did the same in Firefox devtools scratchpad to test https://miketaylr.com/misc/exercises/slider.html, Works.
- Incidentally, Safari seems to suffer from no
arrow function
support. (I did not look to closely into this.)
- JS/CSS bug in content where the developer assumed a prefix was needed when there was not
- Educate the site developer on correct usage of
transform
in Firefox - Bang head on desk again cuz prefixes