Java Script で写真画像を回転るプログラムは？

Question

Jyava ScriptでHPを開いたときに写真の画像を回転するプログラムを
教えていただけないでしょうか？
どうもすみません！
できれば部分的なプログラムではなく全てのプログラムでしたら助かります。
ちなみに　愛読書の「Java Script 困ったときに開く本」には記載がありませんでした。
よろしくお願いいたします。

追伸（２０１８年１１月２２日（木）17：46）
ご指摘ありがとうございました。
「全の→全ての」　に変更しました。
さて、ビジョンが無い！丸投げ的な質問でした・・・反省です。

「Javaで画像ファイルを回転させる」
https://www.dcom-web.co.jp/lab/java/rotate_picture
ネットで検索したところ以上がありましたが！私のレベルだと
今のところちんぷんかんぷんです。
暇暇試したいと思います。
何かありましたら質問しますので
その節はよろしくお願いいたします。

Comments

[yukkuri]

Java、とついていますがJavaには関係ありますか？見た限り関係ないように思えるのですが。あと、細かいですが日本語は正しく使いましょう。回転る->回転する 全の->全ての

[yambejp]

「回転するプログラム」とはとりあえず90℃右向きか左向きに回転させるだけでいいのか？それともぐるぐる回転したり止めたりしたいのか？どちらでしょう

[x_x]

全体の？

[x_x]

「ちんぷんかんぷん」なのはJavaだからでは？　JavaとJavaScriptは中国と中国地方くらい違うって誰かが言ってました

Answer 1

愛読書の「Java Script 困ったときに開く本」には記載がありませんでした。

JavaScriptは基本的にはHTMLを書き換える為のスクリプト言語なのでありません。
HTML5になってオーディオやビデオ関係の機能を追加されましたが、基本的にはHTMLを書き換えるのが主目的です。

写真の画像を回転する

JavaScriptでもHTMLのstyle要素を高速で変更しまくれば実現は可能ですが、
基本的にはCSSアニメーションの方が強いジャンルです。
回転内容が決まっているのであれば、GIF画像や動画ファイル(AVI)等で対応してはどうでしょうか？

部分的なプログラムではなく全のプログラムでしたら助かります。

Teratailの規約的に無理です。ごめんなさい

Answer 2

img {
  transition: transform 3s;
}

img.rotate {
  transform: rotate(1turn);
}

  let observer = new IntersectionObserver((entries, observer) => {
    for (let entry of entries) {
      if (entry.intersectionRatio > 0) {
        observer.unobserve(entry.target);
        entry.target.classList.add('rotate');
      }
    }
  });
  Array.from(document.images).forEach(element => {
    observer.observe(element);
  });

https://developer.mozilla.org/ja/docs/Web/CSS/transform