Question

由于设备限制，我不得不仅使用javascript或JQuery来“镜像”图像。我曾尝试过Reflection.js，但这不是我想要的。

我想要的只是“镜像”img标签的图像。

任何人都可以提供帮助？提前谢谢。

Answer 1

在jsfiddle中试试这个例子：

CSS：

div.reflection
{
    -webkit-transform: scaleY(-1);
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
}

img{
    height: 150px;
    width: 150px;
}

HTML代码：

<div>
    <img src='http://2.bp.blogspot.com/-TslgI6ySuW8/VNC-u9YQYeI/AAAAAAAABtA/mviMstL4pIk/s1600/Screenshot_2015-02-03-17-55-46.png'/>
</div>
<div class="reflection">
    <img src='http://2.bp.blogspot.com/-TslgI6ySuW8/VNC-u9YQYeI/AAAAAAAABtA/mviMstL4pIk/s1600/Screenshot_2015-02-03-17-55-46.png'/>
</div>

Click here

使用Pure Javascript / JQuery镜像图像

1 个答案: