javascript - 通过 Javascript/CSS 翻转 html/图像的跨浏览器方式？

Question

是否有翻转图像的库/简单方法？

像这样翻转图像:

AABBCC      CCBBAA
AABBCC  ->  CCBBAA

我不是在寻找动画，只是翻转图像。

我用谷歌搜索没有找到 avial，只在 MozillaZine 上找到了一个使用 SVG 的复杂版本。我不确定它是否可以跨浏览器工作。

Answer 1

以下 CSS 将在 IE 和支持 CSS 转换的现代浏览器中工作。我包含了一个垂直翻转类，以防您也想使用它。

.flip-horizontal {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    -ms-filter: fliph; /*IE*/
    filter: fliph;
}
.flip-vertical {
    -moz-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    transform: scaleY(-1);
    -ms-filter: flipv; /*IE*/
    filter: flipv;
}