- 締切済み
フィルターを使って画像を入れ替えたいのですが、うまくいきません
今スクリプトやタグについて勉強中です。 フィルターを使って画像を入れ替えたいと思い、下のものを使ってやってみたのですが、ビルダー上ではうまく表示されているのですが、アップすると1枚目のみ表示されず、2枚目からの表示になってしまいます。 初心者なりに色々試してはみたのですが、どうしたらいいのか、分かりません。 全くと言っていいほどの初心者なのでお助けいただければと思います。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- // 画像を一定間隔で入れ替える // img0.jpg,img1.jpgなどの数字が続いたファイルを複数用意します。 num = 20; // 入れ替える画像の枚数(最初の画像も含める) nme = "img/img" // 画像のディレクトリとファイル名の数字と拡張子より前の部分("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)"> 画像が一定間隔で入れ替わります。<BR> 入れ替えるときの効果の種類は<A href="sample/s0801_2.html">こちら</A>を参考にして下さい。<BR><BR> <IMG src="img/img0.jpg" name="img" border="0" style="filter:revealTrans(duration=2,transition=8)"><BR>（"img/img0.jpgの部分に１枚目の画像のファイル名を入れたところ ビルダー上では表示され、うまく入れ替えが出来ているのですが、アップすると入れ替えが出来ず、1枚目のみ表示されてしまいます） </BODY> </HTML> よろしく御願いします。
- muku-mama
- お礼率0% (0/1)
- JavaScript
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- _himajin_
- ベストアンサー率65% (128/195)
ビルダー（HPビルダー？）上ではうまく動いていると言うことなので・・・ filterはIEでしか動かないですが、それ以外のブラウザで表示している、と言うことはないですか？
関連するQ&A
- 画像をフィルターを使って入れ替えたいです
再度恐れ入ります。画像を入れ替えるときに、フィルターを使いたいのです。トップページの画像１枚をもう一枚と入れ替えて、最初の一枚に戻って終わりたいのですが・・・。今のままだと２枚の画像の入れ替えが延々と繰り返すことになるので、それを１回で止めたいのです。本当に初心者な質問で申し訳ございませんが、教えていただけると助かります。どうぞよろしくお願いいたします。 <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>
- ベストアンサー
- JavaScript
- 画像を入れ替えたい
こんにちは。初心者であまりよく分からないので教えていただきたいのですが・・・下記のプログラムで画像を入れ替えるというのをやりたいのですが、ずっと入れ替え続けるのではなくて、１枚目から２枚目に入れ替えるだけで終わらせたいのです。for文を使えばいいとのかなと思うのですが、どこにforを入れたら良いのか分かりません。あるいはもっと簡単なやり方があるのでしょうか・・・。急いでやらないといけないので教えていただけたらと思います。どうぞよろしくお願いします。 <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; document.img.src = nme + cnt + "." + exp; } //--> </SCRIPT> </HEAD> <BODY bgcolor="#ffffff" onLoad="setInterval('changeImage()',1000)"> </BODY> </HTML>
- ベストアンサー
- JavaScript
- １つのファイルで画像をクリックしたら差し代わる方法
表題のようにJavascriptで１つのhtmlファイルで複数の箇所に違う画像があり、それをクリックしたら別の画像に差し代わるということをしたいのですが、中々うまくいかずに困ってしまっています。 下記のようなソースになった場合にそれぞれ別の画像でクリックしたら違う画像に差し替えるには関数等の書き方はどのようにすれば宜しいのでしょうか。 どなたか教えてもらえますでしょうか？ Javascript初心者にて失礼しますm(_ _)m 下記に途中までやったソースがあるのですが、行き詰ってしまってます。。。。。 宜しくお願い致します。m(_ _)m m(_ _)m ・・・・・・・・・・・・・ JavaScriptは下記の通りです。 //１つ目の画像に関係するJavaScriptです <script language="JavaScript"> num = 2; nme = "image/index"; exp = "jpg"; cnt = 0; function changeImage() { cnt++; cnt %= num; document.index.src = nme + cnt + "." + exp; } </script> //２つ目の画像に関係するJavaScriptです <script language="JavaScript"> num = 2; nme = "image/img"; exp = "jpg"; cnt = 0; function changeImg() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } </script> htmlは下記の通りです。 <!--１つ目の画像です--> <a href="JavaScript:changeImage()"> <img src="image/index0.jpg" name="index" border="0"></a> <!--２つ目の画像です--> <a href="JavaScript:changeImg()"> <img src="image/img0.jpg" name="img" border="0"></a>
- ベストアンサー
- JavaScript
- スクリプトの画像入替えでエラーになった！
web画面で画像を数秒間単位で入れ替えるスクリプトを作動していたのですが、画像を２枚から３枚にしたら上手く表示されなくなりました。 全く理由が解りません。 （当初２枚の画像の時） <!-- num = 2; nme = "img/img" exp = "jpg" cnt = 0; function changeImage() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } //--> <body> <A href="b****.shtml"><IMG src="img/img0.jpg","img1.jpg" name="img" border="1"></A> これで上手く作動していました。 ------------------------------------ （画像を３枚にした時） <!-- num = 3; nme = "img/img" exp = "jpg" cnt = 0; function changeImage() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } //--> <body> <A href="*****.shtml"><IMG src="img/img0.jpg","img1.jpg","img2.jpg" name="img" border="1"></A> この場合、プレビューとかIEでは正常に3枚の画像が入れ替わるのですが、実際のWEB画面では、３枚目が×で表示されます。 FTPツールからサーバーへの転送も何度か行いましたが状態は変わりません。 私が理解できないのは、プレビューとかIEで表示されてWEB画面で表示されないのは、サーバーが「img2.jpg」を認識していないということではないでしょうか？ その場合でも、FTPツールからサーバーへの転送をすれば良いのではないでしょうか？ それでも駄目なので、精通されている方にお聞きしたくて相談しました。 宜しくお願いします。
- 締切済み
- その他([技術者向] コンピューター)
- 一つのページで二つ動かすのはできないですか
画像を次々に変えていくJavaScriptを一つのページで2個使いたいのですが、二つ使うと、表示されません。これでは無理なのでしょうか？ 無理だったら、他に何かいい方法があれば教えてください。 これを使いました。よろしくお願いします。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- num = 18; nme = "img" exp = "gif" cnt = 0; function changeImage() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } //--> </SCRIPT> </HEAD> <BODY bgcolor="#ffffff" onLoad="setInterval('changeImage()',500)"> <BR><BR> <IMG src="img1.gif" name="img" border="0"> </BODY> </HTML>
- ベストアンサー
- JavaScript
- 再度、JavaScriptのことで教えて！
先程、JavaScriptのことで質問した者です。 下記にように記述したのですが、プレビューでは正常に表示されるのですが、アップ すると、画像が×印で表示されません。関数、若しくは、ソースの記述に問題があるのでしょうか？ どなたか、検査願えませんか？ --外部ファイル--（ファイル名：men.js） <!-- num = 2; nme = "img/img" exp = "jpg" cnt = 0; function changeImage() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } //--> --ソース--- <script type="text/javascript" src="js/men.js"></script>
- ベストアンサー
- その他([技術者向] コンピューター)
- JavaScriptのことで教えて！
１シートにJavaScriptを２つ使うことは出来ないのでしょうか？ 画像が点滅するJavaScript と画像が入れ替わるJavaScript 両方を１シートで使用できませんか？ この部分は入力できるのですが <SCRIPT language="JavaScript"> <!-- num = 2; // 入れ替える画像の枚数(最初の画像も含める) nme = "../img/img" // 画像のディレクトリとファイル名の数字と拡張子より前の部分 exp = "jpg" // 拡張子 cnt = 0; function changeImage() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } //--> 勿論、点滅のJavaScriptも記載済みです。 ところが、 <BODY onload="blink()"> <BODY bgcolor="#ffffff" onLoad="setInterval('changeImage()',1000)"> このように並列して書くとエラーになります。 ２つのavaScriptは使用できないのでしょうか？ 精通されている方、居られましたら宜しくご指導願います。
- ベストアンサー
- その他([技術者向] コンピューター)
- いくつか用意したフラッシュ（.swfファイル）を切り替え表示したい
フラッシュで作成した.swfファイルをいくつか用意し、ホームページ上で切り替わるように表示したいのですが、どなたか詳しい方、教えていただけないでしょうか？ 画像の切り替えのソース（以下----部分）を利用してみたのですが、.jpgの部分を.swfに置き換えても、上手く表示されませんでした。 具体的に、ソースを記述していただけると、大変うれしいです。 都合のいい質問ですいません。 よろしくお願いします。 ------------------------------------------- <html> <head> <title></title> <script language="JavaScript"> <!-- var cnt = 0; var dat = new Array("img1.jpg","img2.jpg","img3.jpg","img4.jpg"); prLdImg= new Array(); for (i=0; i<dat.length; i++){ prLdImg[i] = new Image(); prLdImg[i].src = dat[i]; } function nextImg(){ var obj = window.document.all('myImg'); if(timerID){clearTimeout(timerID);} cnt++; cnt %= dat.length; obj.filters.revealTrans.Apply(); obj.src = dat[cnt]; obj.filters.revealTrans.Play(); var timerID = setTimeout("nextImg()",3000); } // --></script> </head> <body> <img id="myImg" src="img1.jpg" style="filter:revealTrans(duration=2,transition=12)" onClick="nextImg()"> </body> </html> -------------------------------------------
- ベストアンサー
- JavaScript
- javascriptでループをやめたい
javascript初心者です。 下記の様にソースが書いてあります。 画像が表示され、順番に表示されるのはいいのですが、 最後の画像になった時に、最初の画像に戻り、永遠と画像がループし、 表示されてしまいます。最後の画像になった時に、表示を止め、 最後の画像のまま表示を止めたいのですが、わかりません。 ご教示お願いいたします。 <SCRIPT language="JavaScript"> <!-- FITime=1; FOTime=8; n=10; flg=1; num=0; cnt=7; Fna="./img"; Fexp="jpg"; // 以下スクリプト本体 function fade(img){ if(flg==1){ document.images[img].src=Fna+num%cnt+"."+Fexp; if(n<=0) flg=0; document.images[img].filters['alpha'].opacity=n; if(n>=99)speed=0.05;else speed=5; n-=speed; setTimeout("fade('"+img+"')",FOTime); } else{ document.images[img].src=Fna+(num+1)%cnt+"."+Fexp; document.images[img].filters['alpha'].opacity=n; if(n>=98)speed=0.05;else speed=2; n+=speed; if(n>=100) {flg=1;++num;if(num%cnt==0){num=0;}} setTimeout("fade('"+img+"')",FITime); } } //--> </SCRIPT> </head> <img src="img0.jpg" name="img" style="filter:alpha(opacity=100)">
- ベストアンサー
- JavaScript
- IEとFireFoxの両方で動作するJavaScriptコード
タイトル通り、IEとFireFoxの両方で動作するJavaScriptコードの書き方が分かりません。 現在以下のようなコードで写真をクリックすると切り替わるようにしているのですが、FireFoxでは動いてくれません。。 <script language="JavaScript"> <!-- num = 0; function wipe(theIMG) { num++; num %= 5; theIMG.filters.revealTrans.Apply(); theIMG.src = num+".jpg"; theIMG.filters.revealTrans.Play(); } // --> </script> ***写真の部分*** <img src="0.jpg" width="300" height="400" border="1" alt="PHOTO" name="change" style="filter:revealTrans(duration=1,transition=12)" onClick="wipe(this)"> どなたか分かる方がおりましたら、ご教授願います。 宜しくお願い致します。。
- ベストアンサー
- JavaScript
補足
今現在IE7を使用しています。 多分、ブラウザは大丈夫だと思います。 ただ、ただ、何もわからない状態でやっているため それが、本当にIEなのかどうかすら分からないのが現状です。 お手間を取らせてしまい申し訳ありませんが、ご回答をよろしく御願いします。