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

Question

是否有图书馆/简单的方式来翻转图像？

像这样翻转图像:

AABBCC      CCBBAA
AABBCC  ->  CCBBAA

我不是在寻找动画,只是翻转图像.

我已经google到没有avial,只发现了一个在MozillaZine上使用SVG的复杂版本,我不相信它会跨浏览器工作.

Answer 1

以下CSS将适用于支持CSS转换的IE和现代浏览器.我包括了一个垂直翻转类,以防你也想要使用它.

.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;
}