gifを使用せずにアニメを作ろうと考えています。
最終的には、
最初は普通の文字が書いてある画像があって、それにマウスを持って行くと徐々に文字の色が変化して、やがて特定の色になったところで止まる。もちろんマウスを離せば最初の文字色に戻る。
という機能を持ったJavaScriptのスクリプト(笑)が作りたいわけですが、いまいちよく分かりません。
ちなみに、画像は既にアニメ用のものが8フレーム(つまり8枚)ほど用意してあります。そして、これが8種類あります。これらを各メニューとして、1画面に同時に使いたいわけです(つまり、リンク画像として)。
他のサイトさんでそれを見てやりたくなったんですが、ソースを見ても何がなんだか。まだ初心者なので、かなり意味不明でした。
どうか、よろしくお願いします。
PS 一応、画像ファイルURIは「./cg/pict_0.png」ということで。これが0~7まで8枚あるわけです。
No.1ベストアンサー
- 回答日時:
はじめまして。
setTimeout()を使うと簡単にできます。
がんばって下さい。
<A HREF="xxx.html" onMouseOver="mover(1)" onMouseOut="mout()">
<IMG NAME="im" SRC="./cg/pict_0.png" BORDER="0"></A>
としてJavaScriptは、
function mover(i) {
if(i < 8){
document.images["im"].src="./cg/pict_"+i+".png";
i++;
id=setTimeout("mover("+i+")",100); //1000で1秒:500で0.5秒
}else{
clearTimeout(id);
}
}
function mout() {
clearTimeout(id);
document.images["im"].src="./cg/pict_0.png";
}
早速のご回答ありがとう御座います。試してみたら、見事にできました♪
別なメニューも以下、
function mover(i,n) {
if(n == 1) { name = "aaaa";images="im_1"; }
if(n == 2) { name = "bbbb";images="im_2"; }
if(i < 8) {
document.images[images].src="./cg/names/"+name+"_"+i+".png";
i++;
・
・
・
のように、引数を増やしてみたら1つのfunctionだけで複数の画像で実現できました。ばっちぐーです♪
とても助かりました。どうもありがとうございました。
またご厄介になるかもしれませんが、その時もどうかよろしくお願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Visual Basic(VBA) エクセルマクロでアニメを作る方法を教えてください。 1 2023/02/07 14:27
- Ameba(アメーバブログ) アメブロは、HTMLのタグの入力を許さないブログ・サイトですか? 1 2023/06/18 18:48
- ホームページ作成・プログラミング アメーバ・ブログは"HTMLタグ"を許可してないのですか? 2 2023/06/17 21:08
- Illustrator(イラストレーター) ワードに貼った画像のキャンバスと画像本体のサイズの調整 2 2022/05/19 18:31
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- プリンタ・スキャナー 【至急】EPSON EP-808AB プリンターUSBメモリーが反応しない 3 2022/06/12 01:13
- その他(パソコン・周辺機器) 呪われた様な.......様々な不具合について 2 2022/08/26 15:52
- iPhone(アイフォーン) iPhone13の読み上げコンテンツについて。 2 2022/07/08 04:52
- YouTube YouTubeで公式のアニメ画像や芸能人の顔を載せてる人がいますがあれって実際のところどうなんでしょ 4 2022/08/17 20:26
- YouTube ユーチューブへの動画投稿にサムネイルを付ける方法は? 1 2022/07/21 23:45
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Lightbox2でのキャプションにつ...
-
クリックで背景変更するタグ
-
bxsliderにて読み込み後に内容...
-
Javascript で共通の処理をどこ...
-
JavaScript で flexslider の画...
-
JavaScriptとチェックボックス...
-
スライドショー作成方法。
-
JavaScriptでの画像切替について。
-
スライダーを実装した場合、ペ...
-
代替文字が表示されなくなった...
-
Java Scriptの画像切り替えにつ...
-
VB2005 でビットの深さ8の画像...
-
ロールオーバーで切り替えられ...
-
スワップイメージが上手く動作...
-
JavaScript スライドの画像にリ...
-
右クリック禁止スクリプト挿入法
-
javascriptを使用し、別窓をサ...
-
Photoswipeのアニメーションの変更
-
一定日本時間で画像変更 Java S...
-
画像のサイズが取得できません
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
textareaに画像を表示したい
-
JavaScript スライドの画像にリ...
-
HTMLで条件分岐はできますか?
-
画像ランダム表示、しかしダブ...
-
bxsliderにて読み込み後に内容...
-
画像を切り替えランダム表示
-
1枚の画像をクリックすると複数...
-
Gifアニメ、最後のコマに行った...
-
画像の重なりの順序を代える方...
-
小窓について教えて下さい。
-
スライダーを実装した場合、ペ...
-
スワップイメージが上手く動作...
-
USEMAPでの指定区域にマウスオ...
-
1枚の画像をクリックして複数の...
-
クリッカブルマップの一部分だ...
-
オンマウスで、画像切り替え+...
-
iframe内のリンク文字のマウス...
-
edgeでスクロールバーに色が表...
-
画像の上に画像リンクを貼る方法
-
prettyphotoの画像表示について
おすすめ情報