Search code examples
javascriptfirefoxrotationcompatibility

Firefox Javascript div rotation not working, but does work in Chrome and Safari

loadingSpinner2.style['-webkit-transform'] = "rotate(45deg)";

This line doesn't seem to set the rotation of the loading spinner but in Safari and Chrome it does. How do I make it work in Firefox?

Solution

  • I just want to add to @Musa. transform is new CSS3 property, so the full code in CSS will look like

    -moz-transform: rotate(45deg); /* For Firefox<16.0 */
-ms-transform: rotate(45deg); /* For IE9 only */
-webkit-transform: rotate(45deg); /* For Safari, Chrome, iOS */
-o-transform: rotate(45deg); /* For Opera<12.10 */
transform: rotate(45deg); /* For all other CSS3 compatible major browser */

    so you have to use all of them in this order in your JS, but still it doesn't promise you full browser-support

    EDIT As I understand from your coment you're interested in order of using them: usually the most modern property is the last to apply to override all old properties