javascript - Javascript フリップ画像

Question

画像反転用の JavaScript ライブラリがあるかどうかは誰にもわかりません。css3効果は必要ありません。右が左になるときに画像エディターで行うように、実際に画像を反転させたいです。

Answer 1

画像を反転する簡単な方法は、CSS3 を使用することです。「CSS3効果」とはアニメーションを意味していると思いますが、これはそうではありません。

img {
    transform: scale(-1, 1);
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -khtml-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
}

これは、画像を X 軸で -1 (その軸に沿って反転) し、Y 軸で 1 (何もしない) でスケーリングすることによって機能します。X 軸ではなく Y 軸で反転させたい場合は、X 軸と Y 軸を切り替えることができます。

必要に応じて、回転に CSS3 変換を使用することもできます。時計回りに 90 度回転scale(-1, 1)するようなものを使用するのではなく。rotate(90deg)

---

Internet Explorer をサポートするには、次のfilterプロパティを使用できます。

img {
    filter: fliph;
    /* all of the transforms above */
}