如何使用jQuery翻转图像？

Question

根据请求，我有10-15张来自服务器的图像，我想使用Jquery对这些图像使用翻转图像效果。 任何建议和代码段都会有所帮助。

Answer 1

最简单的解决方案是定义一个CSS类：

img.flipped {
        -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
}

然后使用jQuery应用此类：

$(myImageElement).addClass('flipped');

了解详情：Using CSS transform on the MDN

请注意，这不适用于IE8。而且我没有看到任何针对此浏览器的客户端解决方案（假设画布也不可用）。