jsWaffle質問掲示板(雑談やTips歓迎)

jsWaffleについて質問する掲示板です。(雑談や発見したTipsの投稿も大歓迎です!)

(#202) 回転と反転ならCSS3で - mei (2011-10-06 10:49) /普通 返信
ファイルへの反映はできませんが、確認するだけならCSS3のtransformプロパティでできます。
写真を表示しているimg要素をJavaScriptでphotoとすると、
photo.style.webkitTransform = "rotate(" + d + "deg) scale(" + sx + "," + sy + ")";
とします。
変数dは初期値を0にして、90ずつ変えると、要素が回転します。(正の数でも負の数でも可)
変数sx、syは初期値を1として、-1をかけると反転します。

回転するのなら、img要素の位置(cssのtopとleft)を直した方がいいと思います。その場で回転させると、一部がはみ出してしまいます。
写真表示について / kk (2011-09-21 20:18) (#173)/ 普通 質問
  回転と反転ならCSS3で / mei (2011-10-06 10:49) (#202)/ 普通 返信
    ありがとうございます。 / kk (2011-10-07 16:23) (#206)/ 普通 返信

(#202)へ返信する:

名前
タイトル
本文
困った度
状態
確認キー お手数ですが、いたずら防止のために、半角数字で「8932」と入力してください。
編集キー 編集時に使うキーを入力(省略可能)
添付ファイル 画像ファイル(最大300KB)を添付可能