Today received a request to get a picture of its mirrored symmetry through a picture. This is the background processing, but in addition to the technical difficult to achieve, but also brings the problem of resource consumption, equivalent to each map to store a copy. Just remember that the previous CSS filter can achieve this, but only in IE effective. Later found a compatible multi-browser style, Big love.
CSS style Definitions:
. flip-horizontal { -moz-transform:scalex ( -1); -webkit-transform:scalex ( -1); -o-transform:scalex ( -1); Transform:scalex ( -1); Filter:fliph; /*ie*/}.flip-vertical { -moz-transform:scaley ( -1); -webkit-transform:scaley ( -1); -o-transform:scaley ( -1); Transform:scaley ( -1); FILTER:FLIPV; /*ie*/}
Examples of HTML references:
<img src="http://img.baidu.com/img/logo-zhidao.gif"class=" Flip-horizontal" /><img src="http://img.baidu.com/img/logo-zhidao.gif" Class="flip-vertical" />
Image inversion CSS effect with multi-browser support