• 締切済み

スクリプトの画像入替えでエラーになった!

web画面で画像を数秒間単位で入れ替えるスクリプトを作動していたのですが、画像を2枚から3枚にしたら上手く表示されなくなりました。 全く理由が解りません。 (当初2枚の画像の時) <!-- 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> これで上手く作動していました。 ------------------------------------ (画像を3枚にした時) <!-- 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画面では、3枚目が×で表示されます。 FTPツールからサーバーへの転送も何度か行いましたが状態は変わりません。 私が理解できないのは、プレビューとかIEで表示されてWEB画面で表示されないのは、サーバーが「img2.jpg」を認識していないということではないでしょうか? その場合でも、FTPツールからサーバーへの転送をすれば良いのではないでしょうか? それでも駄目なので、精通されている方にお聞きしたくて相談しました。 宜しくお願いします。

みんなの回答

  • kmee
  • ベストアンサー率55% (1857/3366)
回答No.2

name="img"を削除しろ、ということではありません。もう少しちゃんとした名前を付けましょう、という意味です。 それで、img2.jpgは、ふつうに表示させたら表示できるのですか? <IMG src="img/img0.jpg"> <IMG src="img/img1.jpg"> <IMG src="img/img2.jpg"> こんな風にしてjavascriptも止めて、それでも表示されないなら、「サーバーには存在しない」か「アクセス権がない」かです。 サーバーに無ければ、転送できていない、ということです。 FTPツールと言われても、たくさんあってどれのことだかわかりません。 「変更があったファイルだけ転送する」とか「登録されたものだけ転送する」とか「指定したものを除外する」とか、便利な機能がついたものもあります。 これらの機能が有効になって、img2.jpgが転送されていないとかはないでしょうか? 表示できて、初めてスクリプトを疑います。ただ、今提示されている部分には特に間違いはなさそうです。

  • kmee
  • ベストアンサー率55% (1857/3366)
回答No.1

まず <IMG src="img/img0.jpg","img1.jpg","img2.jpg" name="img" border="1"> 自体が変では? もともと「カンマで区切って複数指定」なんてものはありません。 スクリプトで書き換えられるのでいいかもしれませんが。 あと、name="img"というのも、誤動作の元かも。 で、 なんたら/img/img0.jpg なんたら/img/img1.jpg なんたら/img/img2.jpg (なんたらの部分は、あなたのサーバーに合わせて変更してください)でアクセスすれば、それぞれの画像は見れるのですか? img2.jpgは表示されないということはないですか? そのFTPツールは、「登録されたものだけ転送する」とかになってないですか? 単純に、サーバーにimg2.jpgが無いか、読めるようになっていないってことだと思うのですが

kfjbgut
質問者

お礼

1、 いろいろご指摘頂きましたが、しかし、画像が2枚の時は正常に認識はされていたのですがね。 2、 name="img"を削除するとエラ-になります。 3、 「登録されたものだけ転送する」ってどういう意味ですか?

関連するQ&A

  • 1つのファイルで画像をクリックしたら差し代わる方法

    表題のようにJavascriptで1つのhtmlファイルで複数の箇所に違う画像があり、それをクリックしたら別の画像に差し代わるということをしたいのですが、中々うまくいかずに困ってしまっています。 下記のようなソースになった場合にそれぞれ別の画像でクリックしたら違う画像に差し替えるには関数等の書き方はどのようにすれば宜しいのでしょうか。 どなたか教えてもらえますでしょうか? Javascript初心者にて失礼しますm(_ _)m 下記に途中までやったソースがあるのですが、行き詰ってしまってます。。。。。 宜しくお願い致します。m(_ _)m m(_ _)m ・・・・・・・・・・・・・ JavaScriptは下記の通りです。 //1つ目の画像に関係する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> //2つ目の画像に関係する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は下記の通りです。 <!--1つ目の画像です--> <a href="JavaScript:changeImage()"> <img src="image/index0.jpg" name="index" border="0"></a> <!--2つ目の画像です--> <a href="JavaScript:changeImg()"> <img src="image/img0.jpg" name="img" border="0"></a>

  • 画像を入れ替えたい

    こんにちは。初心者であまりよく分からないので教えていただきたいのですが・・・下記のプログラムで画像を入れ替えるというのをやりたいのですが、ずっと入れ替え続けるのではなくて、1枚目から2枚目に入れ替えるだけで終わらせたいのです。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を一つのページで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>

  • 画像をフィルターを使って入れ替えたいです

    再度恐れ入ります。画像を入れ替えるときに、フィルターを使いたいのです。トップページの画像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>

  • 再度、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>

  • フィルターを使って画像を入れ替えたいのですが、うまくいきません

    今スクリプトやタグについて勉強中です。 フィルターを使って画像を入れ替えたいと思い、下のものを使ってやってみたのですが、ビルダー上ではうまく表示されているのですが、アップすると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枚目の画像のファイル名を入れたところ ビルダー上では表示され、うまく入れ替えが出来ているのですが、アップすると入れ替えが出来ず、1枚目のみ表示されてしまいます) </BODY> </HTML> よろしく御願いします。

  • JavaScriptのことで教えて!

    1シートにJavaScriptを2つ使うことは出来ないのでしょうか? 画像が点滅するJavaScript と画像が入れ替わるJavaScript 両方を1シートで使用できませんか? この部分は入力できるのですが <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)"> このように並列して書くとエラーになります。 2つのavaScriptは使用できないのでしょうか? 精通されている方、居られましたら宜しくご指導願います。

  • 画像を変えるスクリプト

    <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- img=new Array(); for(i=1;i<=4;i++){ img[i]=new Image(); img[i].src="img"+i+".gif"; } function changeImage(i,j){ document.images[i].src=img[j].src; } // --> </SCRIPT> </HEAD> <BODY> <CENTER> <A href="#" onMouseOver="changeImage(0,2)" onMouseOut="changeImage(0,1)"><IMG src="img1.gif" border=0></A><BR> <BR> <A href="#" onMouseOver="changeImage(1,4)" onMouseOut="changeImage(1,3)"><IMG src="img3.gif" border=0></A> </CENTER> </BODY> </HTML> マウスオーバーしたら画像が変わるスクリプトです。 質問ですがこのスクリプトでどうしてオブジェクトを作っているのでしょうか? 普通にsrcプロパティを変更するだけではだめなのでしょうか?例えばdocument.images[i].src="img"+j+".gif"のようにしてiとjを変えるような 感じです。

  • 画像の入れ替え

    先日、ここで質問をして、javascript を使って画像を入れ替える方法を教えてもらいました。 <script type="text/javascript"> <!-- function toggle(img){ if(img.normal==null) img.normal=true; img.src= img.normal ? 'a.jpg' : 'b.jpg'; img.normal=!img.normal; } //--> </script> … <img src="a.jpg" alt="画像" onclick="toggle(this)"> ということだったのですが、これだと2枚の画像しか入れ替えることができないので、3枚の画像を入れ替えようと、img.src= img.normal ? 'a.jpg' : 'b.jpg': 'c.jpg';と書いてみたのですが、スクリプトエラーが出てしまって、うまくいきません。どのようにすれば、3枚以上の画像を入れ替えることができるでしょうか?ABCDEF→ABCDEFのように変っていくようにしたいのですが。 よろしくお願いいたします。

  • サムネイル画像をオンマウスで拡大表示してそれぞれの画像にリンクを指定する記述について

    お世話になります。 JavaScript初心者ですが、フリーソースなどを見つつ勉強しております。 下記のようなhtmlに【js00】と【js01】を読み込んでサムネイル画像をオンマウス時に上部に拡大表示させているのですが、サムネイル画像と拡大表示画像の両方に指定リンクをつけようとしています。 記述4の【js02】のような画像をランダム表示して指定リンクをつけるScriptは発見できたのですが、これを記述1+2+3と組み合わせられず、作業が進まなくなってしまいました…。 フリーソースを応用しようとしすぎて、遠回りな記述になっているかもしれませんが、もし分かる方がいらっしゃったら教えて頂けないでしょうか? ■記述1(html) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <SCRIPT language="JavaScript" type ="text/javascript" src="http://test.com/00.js"> </SCRIPT> </head> <body> <table width="400"> <a href="#" target="_blank"> <img src="http://test.com/img/01.jpg" name="imgSample"></a> <div> <div> <script language="JavaScript" type ="text/javascript" src="http://test.com/01.js"> </script> </body> </html> ■記述2(js00) //画像の名前を配列に代入していきます。 strPictureName = new Array("http://test.com/img/01.jpg","http://test.com/img/02.jpg","http://test.com/img/03.jpg","http://test.com/img/04.jpg","http://test.com/img/05.jpg","http://test.com/img/06.jpg","http://test.com/img/07.jpg","http://test.com/img/08.jpg"); function SetPicture(nVal) { document.imgSample.src = strPictureName[nVal]; } ■記述3(js01) //サムネイル画像をオンマウスで拡大表示 img_num="8"; if( img_num == "" ){img_num='5';} for ( cnt = 1 ; cnt <= img_num ; cnt++ ) { cnt2 = cnt-1; document.write( "<a href=\"#\" onMouseOver=\"SetPicture("+cnt2+");\" class=\"menu\"><img src=\""http://test.com/0"+cnt+".jpg\" width=\"100\" height=\"86\"></a>" ) ; } ■記述4(js02) // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://www.yahoo.co.jp/"; jmp[1] = "http://bb.yahoo.co.jp/"; jmp[2] = "http://www.yahoo.co.jp/"; jmp[3] = "http://auctions.yahoo.co.jp/"; jmp[4] = "http://aeu.jp/cs/"; jmp[5] = "http://google.com/"; jmp[6] = "http://google.co.jp/"; jmp[7] = "http://news.yahoo.co.jp/"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "http://test.com/01.jpg"; img[1] = "http://test.com/02.jpg"; img[2] = "http://test.com/03.jpg"; img[3] = "http://test.com/04.jpg"; img[4] = "http://test.com/05.jpg"; img[5] = "http://test.com/06.jpg"; img[6] = "http://test.com/07.jpg"; img[7] = "http://test.com/08.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>"); ■完成イメージ   | ̄ ̄ ̄ ̄ ̄ ̄ ̄|   |  拡大画像  |   |_______|   | ̄|| ̄|| ̄|| ̄|   |_||_||_||_|←サムネイル ・サムネイル画像をオンマウスで拡大画像を表示 ・サムネイル画像、拡大画像それぞれに指定リンクを入れる ・可能であればリンクページは target="_blank" で開きたい 以上がご質問内容です。 初心者で大変恐縮ですが、どうぞよろしくお願いいたします。