Представляю вашему вниманию генератор свойства css-transform, который производит преобразование значений CSS3 transform в параметры filter:Matrix, позволяющий нам отобразить результат в IE6-8.
Для решения подобных задач зачастую используется JavaScript, например, библиотека cssSandpaper.
Отличительная особенность способа, указанного в статье,— получение css transform кроссбраузерно без использования яваскрипта.
Пример конечного результата:
#transformedObject {
width: 220px;
height: 70px;
-moz-transform: rotate(15deg)
translateX(230px)
scale(1.5);
-o-transform: rotate(15deg)
translateX(230px)
scale(1.5);
-webkit-transform: rotate(15deg)
translateX(230px)
scale(1.5);
transform: rotate(15deg)
translateX(230px)
scale(1.5);
}
width: 220px;
height: 70px;
-moz-transform: rotate(15deg)
translateX(230px)
scale(1.5);
-o-transform: rotate(15deg)
translateX(230px)
scale(1.5);
-webkit-transform: rotate(15deg)
translateX(230px)
scale(1.5);
transform: rotate(15deg)
translateX(230px)
scale(1.5);
}
А для IE через условные комментарии:
#transformedObject {
/* для IE8+ */
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.4488887394336025, M12=-0.388228567653781, M21=0.388228567653781, M22=1.4488887394336025, SizingMethod='auto expand')";
/* IE6 и 7 */
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=1.4488887394336025,
M12=-0.388228567653781,
M21=0.388228567653781,
M22=1.4488887394336025,
SizingMethod='auto expand');
/* Для корректировки центра трансформации объекта. */
margin-left: 58px;
margin-top: -32px;
}
/* для IE8+ */
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.4488887394336025, M12=-0.388228567653781, M21=0.388228567653781, M22=1.4488887394336025, SizingMethod='auto expand')";
/* IE6 и 7 */
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=1.4488887394336025,
M12=-0.388228567653781,
M21=0.388228567653781,
M22=1.4488887394336025,
SizingMethod='auto expand');
/* Для корректировки центра трансформации объекта. */
margin-left: 58px;
margin-top: -32px;
}