前へ【JavaScript】キャットモーション投稿日:2019年07月02日さて、前回つくりました自動スライドで写真を紹介するページ。この仕組みを使って、ひとつループアニメーションを作ってみましょう。作品名はキャットモーション。リアルなアニメーションを作るには、まず画像をたくさん用意しなければなりません。多ければ多いほどリアルに見えるわけですが、今回は8枚の画像を用意しました。画像サイズはすべて同じに。プログラムを書いていきましょう。関数startを作り、処理内容には、motion()を0.1秒おきに表示する仕組みを。100);}</script>motion()のうしろの1000の単位はミリ秒ということでした。ここでは0.1秒になります。続いて、motionも定義していきましょう。"img/cat_motion/cat08.png");}}8枚の写真を「%(割った余り)」を使ってループカウント。"photo"></body>続いて、start()を実行するタイミング。ここでは、ブラウザを開いた時にロードさせました。JavaScriptプログラミングで、動きのあるWEBページ。したループ表示の仕組みは、ホームページを作るとき、いろいろなアイデアで活用できそうですね。子ども向けスクールを開校中。WEBアプリケーション、MineCraft、デザイン実習、ゲーム開発、ICT学習などパソコンのことを学べる小中高生向けIT学習塾です。関西一円から広く生徒を募集しています。