画像を回転させる


動作ブラウザ 【 IE:5.5  NN:-
Internet Explorer Netscape Navigator DreamPassport iCab
3.0x 4.0x 4.5 5.0x 5.5 2.0x 3.0x 4.0x 4.x 6.0 2 3 2.x
Windows × × - × × × × × × - × -
Macintosh × × × × - × × × × × - - ×
UNIX - - - - - × × × × × - - -
Dreamcast - - - - - - - - - - × × -

ポイント obj = myIMG.filters[0].ElementImage(); rot.Image = obj.Transform(rot.MeterLibrary.Rotate2RateDegrees(10)); rot.Start(); <object id="rot" style="position:absolute;left:50px;top:50px;width:320px;height:320px;" classid="CLSID:B6FFC24C-7E13-11D0-9B47-00C04FC2F51D"> <img src="image.jpg" width="320" height="240" id="myIMG" style="width:320px;height:240px;background-color:yellow;filter:Redirect()">
説  明 Redirectフィルタを使えば文字や画像を簡単に回転できます。回転させるにはあらかじめスタイルシートでfilter:Redirect()を指定しておきます。回転角度はRotate2RateDegrees(角度)で指定します。
サンプル <html> <head> <title>画像を回転させる</title> <script language="JavaScript"><!-- function rotIMG() { obj = myIMG.filters[0].ElementImage(); rot.Image = obj.Transform(rot.MeterLibrary.Rotate2RateDegrees(10)); rot.Start(); } // --></script> </head> <body onLoad="rotIMG()"> <object id="rot" style="position:absolute;left:50px;top:50px;width:320px;height:320px;" classid="CLSID:B6FFC24C-7E13-11D0-9B47-00C04FC2F51D"></object> <img src="image.jpg" width="320" height="240" id="myIMG" style="width:320px;height:240px;background-color:yellow;filter:Redirect()"> </body> </html>
補足説明 なし

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA