再度恐れ入ります。画像を入れ替えるときに、フィルターを使いたいのです。トップページの画像1枚をもう一枚と入れ替えて、最初の一枚に戻って終わりたいのですが・・・。今のままだと2枚の画像の入れ替えが延々と繰り返すことになるので、それを1回で止めたいのです。本当に初心者な質問で申し訳ございませんが、教えていただけると助かります。どうぞよろしくお願いいたします。
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="JavaScript">
<!--
// 画像を一定間隔で入れ替える
// img0.jpg,img1.jpgなどの数字が続いたファイルを複数用意します。
num = 2; // 入れ替える画像の枚数(最初の画像も含める)
nme = "img/img" // 画像のディレクトリとファイル名の数字と拡張子より前の部分
exp = "jpg" // 拡張子
cnt = 0;
function changeImage() {
cnt++;
cnt %= num;
img.filters.revealTrans.Apply();
img.src = nme + cnt + "." + exp;
img.filters.revealTrans.Play();
}
//-->
</SCRIPT>
</HEAD>
<!-- 画像を入れ替える間隔(ミリ秒単位) -->
<BODY bgcolor="#ffffff" onLoad="setInterval('changeImage()',5000)">
<IMG src="img/img0.jpg" name="img" border="0" style="filter:revealTrans(duration=2,transition=8)"><BR>
</BODY>
</HTML>
No.5ベストアンサー
- 回答日時:
以下の3点を確認しました。
-------------------------------------------------------------
・ IEでのフィルタ動作。
・ 画像が3枚。
・ Foxfire等のフィルタに対応していないブラウザ場合でも
画像だけは切り替わる。
-------------------------------------------------------------
<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
// 画像を一定間隔で入れ替える
// img0.jpg,img1.jpgなどの数字が続いたファイルを複数用意します。
num = 3; // 入れ替える画像の枚数(最初の画像も含める)
nme = "img/img" // 画像のディレクトリとファイル名の数字と拡張子より前の部分
exp = "jpg" // 拡張子
cnt=0;
function changeImage() {
cnt++;
cnt %= num;
if (img.filters) {
img.filters.revealTrans.Apply();
img.filters.revealTrans.Play();
}
img.src = nme + cnt + "." + exp;
if (img.src==img0_src) {
clearInterval(tid);
}
}
//-->
</script>
</head>
<body bgcolor="#ffffff"
onload="img0_src=document.img.src;tid=setInterval('changeImage()',5000)">
<img src="img/img0.jpg" name="img" border="0"
style="filter: revealTrans(duration=2,transition=8)" alt="">
<br>
</body>
</html>
-------------------------------------------------------------
ばっちり思うように動作いたしました。本当に初心者でよく分からないのに今日明日でやらないといけなくて、焦って泣きそうでしたので、大変助かりました。心から感謝いたします。これからは時間をつくって、ちょっと一から勉強したいと思います・・・。
No.4
- 回答日時:
こんにちは
一応こんな感じでも出来ると思います(画像のファイル名は何でもいいです)
<script type="text/javascript"><!--
window.onload=function() {
Times = setInterval("imagech()",5000);
}
IMG = new Array("","img/img1.jpg","img/img0.jpg");
cnt = 0;
function imagech() {
Img = document.getElementById("img");
cnt++;
Img.filters.revealTrans.Apply();
Img.src = IMG[cnt];
Img.filters.revealTrans.Play();
if(cnt == 2) clearInterval(Times);
}
//--></script>
<img src="img/img0.jpg" id="img" border="0" style="filter:revealTrans(duration=2,transition=8)">
IMG = new Array("","","","",……,""); で登場させる画像の順番に絶対パス(または相対パス)を並べて(1つ目の""は選択されませんので空白です)
全部同じフォルダ内にあるなら画像ファイル名だけにして
Img.src = IMG[cnt]; を
Img.src = "./img/" + IMG[cnt]; ( " " 内はフォルダのパス)としてもいいです
if(cnt == *) で止める枚数を決めます(ループにするならこのときにcnt=0; として戻せばいいです → if(cnt == 2) cnt = 0; )
あとfilter関係はIE専用だということをご了承くださいm(--)m
ありがとうございます!ばっちり出来ました!!ご丁寧に解説していただき、とても勉強になりました。世の中賢くて親切な人がいるなあと本当に感謝しております。
No.3
- 回答日時:
元のソースを生かすと、
-----------------------------------------------------
<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
// 画像を一定間隔で入れ替える
// img0.jpg,img1.jpgなどの数字が続いたファイルを複数用意します。
num = 2; // 入れ替える画像の枚数(最初の画像も含める)
nme = "img/img" // 画像のディレクトリとファイル名の数字と拡張子より前の部分
exp = "jpg" // 拡張子
cnt=0;
function changeImage() {
cnt++;
cnt %= num;
img.filters.revealTrans.Apply();
img.src = nme + cnt + "." + exp;
img.filters.revealTrans.Play();
if (img.src==img0_src) {
clearInterval(tid);
}
}
//-->
</script>
</head>
<body bgcolor="#ffffff" onload="img0_src=document.img.src;tid=setInterval('changeImage()',5000)">
<img src="img/img0.jpg" name="img" border="0"
style="filter: revealTrans(duration=2, transition=8)" alt="">
<br>
</body>
</html>
-----------------------------------------------------
この回答への補足
できました!ありがとうございました。本当に初心者で勉強不足で申し訳ございません。さらに教えていただけるとありがたいのですが、入れ替わった後に、最初の画像に戻ることも可能でしょうか?つまり、1枚目から2枚目に変わり、1枚目に戻って終わりたいのですが・・・。よろしくお願いいたします。
補足日時:2008/02/13 20:26No.1
- 回答日時:
<HTML>
<SCRIPT language="JavaScript">
cnt = 0;
function changeImage() {
cnt++;
img.filters.revealTrans.Apply();
img.src = 'img'+cnt + '.jpg';
img.filters.revealTrans.Play();
if(cnt<2) setTimeout('changeImage()',5000);
}
</SCRIPT>
<BODY bgcolor="#ffffff" onLoad="setTimeout('changeImage()',1000)">
<IMG src="img0.jpg" name="img" border="0" style="filter:revealTrans(duration=2,transition=8)"><BR>
</BODY>
</HTML>
この回答への補足
ありがとうございました。本当に初心者で恥ずかしい限りなのですが、どうもうまくいきません・・・また明日チャレンジしてみます。取り急ぎ御礼まで。
補足日時:2008/02/13 20:29お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします 4 2023/06/17 19:12
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- HTML・CSS サルワカさんの吹き出しのスタイルシートについて。 https://saruwakakun.com/h 2 2022/10/28 22:55
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- Perl 画像が表示でnull; this.src 1 2022/04/19 11:31
- その他(開発・運用・管理) フォルダの中にファルダを作成してファイルを格納するバッチコマンド 1 2022/06/30 11:39
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
javascriptでのパスについて
-
画像を入れ替えたい
-
複数画像のランダム複数表示(...
-
ダイアログから画像ファイルは...
-
jqueryのスライドショー。html...
-
テキストにマウスオーバーで画...
-
MAX関数を使ってからLEFT JOIN...
-
htmlの記述で link rel=styles...
-
画像の上に画像リンクを貼る方法
-
スライダーを実装した場合、ペ...
-
背景色を一定時間ごとにランダ...
-
文字を固定したいのですが…
-
javascriptでURLにマウスオーバー
-
[急ぎ] videoタグで埋め込んだm...
-
文字と数字が混在する要素のsor...
-
離れた場所にマウスオーバーで...
-
ホームページビルダー15 メニュ...
-
c++std::string型をTCHARに変換...
-
タブで開いてさらにタブ内をア...
-
1行で左寄せと右寄せと中央揃え...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
JavaScriptで変更した属性の元...
-
MFCで画像を表示させているので...
-
画像が表示でnull; this.src
-
error LNK2019 未解決のシンボ...
-
Vb.net2005での画像の合成方法
-
onclickで画面が固まる・・・ら...
-
リンク先を動的に変更する
-
(javascript)HTMLで指定した...
-
【OpenCV】二値画像後、白の部...
-
jQuery 複数のfind()
-
ラズパイでno module named zbar
-
外部javascriptの重複を防ぐには
-
条件分岐でキーが入力されてい...
-
かぶらないランダム画像
-
HTMLからimgのsrcのみを正規表...
-
pythonで、tkinterとpillowの組...
-
OpenCV での画素値の比較について
-
imgボタンにfocusの当て方
-
指定したフォルダの画像を一括...
-
OpenCVでサンプルコードを使う...
おすすめ情報