使用Pure Javascript/JQuery鏡像圖像

由於設備限制，我只能使用javascript或JQuery來「鏡像」圖像。我曾嘗試Reflection.js，但那不是我想要的。使用Pure Javascript/JQuery鏡像圖像

我想要的只是「鏡像」img標籤的圖像。

任何人都可以幫忙嗎？提前致謝。

2013-03-01 Eds Tan

我的直覺是假設answe r是否定，但是您可以依賴HTML5畫布還是會打破設備限制？ – ramblinjan 2013-03-01 02:06:55

這看起來像是一個副本http://stackoverflow.com/questions/8168217/html-canvas-how-to-draw-a-flipped-mirrored-image – 2013-03-01 02:08:57

什麼是設備？如果它支持css3（即webkit），那麼它很簡單，不需要JS，http://jsbin.com/ugecus/1/edit – elclanrs 2013-03-01 02:09:35

試試這個例子提及的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

來源

2013-03-25 10:11:02 Rubyist

使用Pure Javascript/JQuery鏡像圖像

回答

相關問題