I have the following mixin for cross-browser transform:
.transform (...) {
-webkit-transform: @arguments; /* Chrome, Opera 15+, Safari 3.1+ */
-moz-transform: @arguments; /* Firefox 3.5+ */
-ms-transform: @arguments; /* IE 9 */
-o-transform: @arguments; /* Opera 10.5+ */
transform: @arguments; /* Firefox 16+, IE 10+, Opera */
}
.translate(@x:0, @y:0) {
.transform(translate(@x, @y));
}
And apply it something like the following:
#main {
.translate(280px, 0);
}
But it's not wotk in IE8 and Opera mini. Is there some fallback, polyfill or any for supporting it in therese browsers?
There are a few you can use, the ones suggested from modenizer are:
css sandpaper and transformie.
I'd argue though, that adding pollyfills to older browser like ie8 damages the performance of an already past it browser and lowers the user experience. Also, if you are adding pollyfills to mobile browsers you are adding to the loading times which in a 3g connection might put users off.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With