javascriptのカルーセル
- javascriptを使用して配列に入れたイラストとタイトルを順次両方向に表示するカルーセルを作成したい
- 画像をボタンで前後に移動する機能は実装できたが、画像に対応する表題を表示する方法がわからない
- テーブルを利用して画像と表題を配列から呼び出すことは可能かどうか悩んでいる
- ベストアンサー
javascriptのカルーセル
配列に入れたイラストとそのタイトルを「次へ」「戻る」ボタンで順次両方向に表示したいのです。画像をボタンで前後に移動するところまではできたのですが、画像に対応する表題をどうやって表示したらいいのかどなたか教えていただけないでしょうか。やはりテーブルを利用しないとだめでしょうか。そうすると今度は画像をどうやって配列からテーブルに呼び出していいかわかりません。表題ですので画像と表題を配列に入れて同じカウンタで呼び出せればと思っています。以下現在のコードです。よろしくお願いします。 <html> <head> <title>バックナンバー</title> </head> <body> <center> <table width="550"><tr><td><td> <script type="text/javascript"> <!-- //画像を格納する配列の作成 var IMG = new Array(); IMG[0]=new Image(); IMG[0].src="chatsune/chatsune18.JPG"; IMG[1]=new Image(); IMG[1].src="chatsune/chatsune19.JPG"; IMG[2]=new Image(); IMG[2].src="chatsune/chatsune20.JPG"; IMG[3]=new Image(); IMG[3].src="chatsune/chatsune21.JPG"; IMG[4]=new Image(); IMG[4].src="chatsune/chatsune22.JPG"; IMG[5]=new Image(); IMG[5].src="chatsune/chatsune23.JPG"; IMG[6]=new Image(); IMG[6].src="chatsune/chatsune24.JPG"; IMG[7]=new Image(); IMG[7].src="chatsune/chatsune25.JPG"; var cnt=0; function Forward() { if(document.getElementById) { if(cnt >= IMG.length-1) { cnt = IMG.length-1; } else{ cnt++; document.getElementById("sd").src = IMG[cnt].src; //一つ画像を表示したらカウント用変数cntの値を＋１にする } } } function Back() { if(document.getElementById) { if(cnt <= 0) { cnt = 0; } else { cnt--; document.getElementById("sd").src = IMG[cnt].src; } } } </script> <img src="chatsune/chatsune18.JPG" id="sd" width="500" height="480" alt=""> <br> </td></td></tr> <tr><td align="left"> <form name="slide"> <input type="button" value="戻る" onclick="Back()"></td> <td align="right"> <input type="button" value="次へ" onclick="Forward()"></td></tr> <tr><td></td><td align="right"> <a href="list.html">バックナンバーのリストへ戻る</a></td></tr> </table> </form> </body> </center> </html>
- minazz
- お礼率60% (14/23)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
画像の変わりにテキストを、同様に入れ替えてあげればよろしいかと。 同じ雰囲気でいくのなら、例えばそのまま画像の下に表題を表示するとして、HTMLの画像タグの改行の後に <span id="caption">caption0</span> などのような表題を表示する部分を設けておいて、 画像と同様に表題を配列で caption[0] = "Caption0"; caption[1] = "Caption1"; ・・・・・ 定義しておいて、画像を入れ替えるのと同時に document.getElementById("sd").src = IMG[cnt].src; document.getElementById("caption").innerHTML = caption[cnt]; のように、テキストを入れ替えてあげれば可能です。 （他にも方法はいろいろあると思いますが…） ついでながら… <table width="550"><tr><td><td> <img src= > </td></td></tr> っておかしくありませんか？（使うならcolspan=2とかでは？） Back()とForward()はほとんど同じ処理なので、 function move(n) { var elm, idx; if (!(elm = document.getElementById("sd"))) return; idx = cnt + n; if (idx<0 || idx>=IMG.length) return; cnt = idx; elm.src = IMG[idx].src; document.getElementById("caption").innerHTML = caption[idx]; } みたいにまとめておいて、move(1)、move(-1)のようにして使うという考えもありかも。
その他の回答 (1)
- yyr446
- ベストアンサー率65% (870/1330)
<image>要素には、そもそもaltという属性があって、その画像のタイトルを 入れても、この場合イラストのタイトルだから許されると思います。 だから、 IMG[0]=new Image(); IMG[0].src="chatsune/chatsune18.JPG"; と同じように IMG[0].alt="hogehoge18"; とセットしとけます。 表題の表示は、単に<span>要素のテキストノードの書き換えでもいいでしょう。 document.getElementById("title").innerHTML = IMG[cnt].alt; とか、 var title,span; title = document.getElementById("title"); span = document.createElement("span"); span.appendChild(document.createTextNode(IMG[cnt].alt)); while(title.hasChildNodes()) title.removeChild(title.firstChild); document.getElementById("title").appendChild(span); とかで、 <div id="title"></div>をお好きな場所に配置して、CSSで調整 すればよいんじゃないかと...
お礼
.innerHTMLの使い方がやっとわかりました。非常に助かりました。ありがとうございました！
関連するQ&A
- [JavaScript]Table内の文字列書換
下記のようにTableを作り、上に場所名、下に画像を貼り JavaScriptで反時計回りに定期的に場所名と画像の位置を変えるプログラムを作成しています。 画像位置を変えることはできたのですが、文字列を変えることができません。 どなたかご教示ください。 ===================================== | 場所A | 場所B | ================= =================== | | | | | 画像B | | | | | 画像 A =================== | | 場所C | | =================== | | | | | 画像C | | | | | =================== | | 場所D | | =================== | | | | | 画像D | | | | ===================================== <HTML> <HEAD> <TITLE>TEST</TITLE> <META HTTP-EQUIV="content-type" CONTENT="text/html;charset=UTF-8"> <META HTTP-EQUIV="refresh" CONTENT="50"> </HEAD> <BODY BGCOLOR="000000" TEXT="#FFFFFF"> <table ALIGN="CENTER" border="5" > <tr><td>A</td><td>B</td></tr> <tr><td rowspan=5><IMG SRC="A.jpg" NAME="SP1"><SCRIPT language="javaScript"> <!-- var NO1=1,NO2=2,NO3=3,NO4=4; img=new Array(4) img[1]="A.jpg" img[2]="B.jpg" img[3]="C.jpg" img[4]="D.jpg" UP(); function UP() { setTimeout("UP()",10000); document.SP1.src=img[NO1]; document.SP2.src=img[NO2]; document.SP3.src=img[NO3]; document.SP4.src=img[NO4]; NO1++; NO2++; NO3++; NO4++; if(NO1>4){NO1=1;} if(NO2>4){NO2=1;} if(NO3>4){NO3=1;} if(NO4>4){NO4=1;} } //--> </SCRIPT> </td> </td> <td><IMG SRC="B.jpg" NAME="SP2"</td></tr> <tr><td">C</td></tr> <tr><td><IMG SRC="C.jpg" NAME="SP3"></td></tr> <tr><td>D</td></tr> 一部省略 </table> </body> </ht
- 締切済み
- JavaScript
- JAVASCRIPTの接続子について
始めまして、JAVASCRIPPTで以下の様なコードを書いているのですが 'img' + page;の部分でエラーになってしまいます。どなたか正しい書き方を御享受下さい。 //画像を最初にキャッシュする var img1 = new Image(); var img2 = new Image(); var img3 = new Image(); var img4 = new Image(); var page = 0; img0 = "image/ginotitle.JPG"; img1 = "image/Gino1page.JPG"; img2 = "image/Gino2page.JPG"; img3 = "image/Gino3page.JPG"; function moverts(){ switch(window.event.button) { case 1://************** 左クリック ********************************************* page = page - 1 ; //指定された画像を変更する document.getElementById("pic").src = 'img' + page; //id名「pic」の画像ソースをobjの画像ソースに書き換える document.getElementById("pic").src = 'img' + page; break; case 2://************** 右クリック ********************************************* page = page + 1 ; alert( = sns ); //指定された画像を変更する document.getElementById("pic").src = 'img' + page; //id名「pic」の画像ソースをobjの画像ソースに書き換える document.getElementById("pic").src = 'img' + page; break; } }
- 締切済み
- その他([技術者向] コンピューター)
- onclickで画像と文字を別々の場所に表示したいのですが...
onclickで小さい画像を別の場所に大きな画像で表示することは出来たのですが、その時に別の場所に文字を表示したいのです。 （例えば：「山」の小さな画像をクリックすると大きな「山」の画像が表示されて←これはＯＫ、 その下に「富士山」の文字を表示したい←これです。） 下記のようにしています。 <script language="javascript"> <!-- function Image(img){ document.getElementById("image").src=img} //--> </script> </head> <table> <tr> <td><img src="sample1_small.jpg" onclick="Image('sample1.jpg')"></td> <td><img src="sample2_small.jpg" onclick="Image('sample2.jpg')"></td> <td><img src="sample3_small.jpg" onclick="Image('sample3.jpg')"></td> <td><img src="sample4_small.jpg" onclick="Image('sample4.jpg')"></td> </tr> <tr> <td colspan="4"><img src="sample1.jpg" name="image"></td> </tr> <tr> <td>***ここに文字を表示させたいのです***</td> </tr> </table> 宜しくお願いします。
- ベストアンサー
- JavaScript
- javascriptを使って画像を切り替える
javascriptを使って画像（id="chengeImg"）を切り替えたいと思っています。 画像はsamp0.jpg～samp4.jpgの計5枚 ただ、問題があって、 画像によって移り替わる時間を変えたいんです。（一定ではない） setTimeoutの引数(time)と画像を、どう結びつければよいのかが 分からず困っています。 それぞれ、 画像0の時は5000ミリ秒 画像1の時は4000ミリ秒 画像2の時は3000ミリ秒 … と移り変わる速度を変えたいのです。 一応、timeは配列がいいのかと配列にしてみました それが良いのかどうかも定かではないのですが… どのようにすれば、時間が一定でない画像切り替えが可能になるでしょうか？ スクリプトを詳しく教えていただけると、ありがたいです。 以下、javascriptの一部を記します。 【js】ファイル(imagechange.js)------ window.onload=anime; var img=new Array(5); img[0]=new Image(); img[1]=new Image(); img[2]=new Image(); img[3]=new Image(); img[4]=new Image(); img[0].src="samp0.jpg"; img[1].src="samp1.jpg"; img[2].src="samp2.jpg"; img[3].src="samp3.jpg"; img[4].src="samp4.jpg"; //画像枚数 var num=0; //時間制御 time = new Array(5000, 4000, 3000, 3000, 3000); function anime(){ var ch = document.getElementById("changeImg"); ch.src=img[num].src; if(num<4){ num++; }else{ num=0; } setTimeout("anime()",time); } 【html】ファイル-------- <head> <title>画像切り替え</title> <script type="text/javascript" src="imagechange.js"</script> </head> <body> <p><img src="samp0.jpg" width="700" height="200" id="chengeImg"></p> </body> </html> 以上となります。 詳しい方、ぜひ教えてくださいませ。 どうぞ宜しくお願いいたします。
- ベストアンサー
- JavaScript
- 画像切り替える&画像何千枚でもコード増やさない方法
html上に表示させた画像をクリックすると、画像を切り替えるプログラムを作りたいのですが、 うまく動作しません。 １つ目の質問は、 document.images[]の方法もありますが、正しくなく互換がないそうなので使いたくありません。 document.getElementById()で画像を切り替えるにはどうしたらいいのでしょうか？ ２つ目の質問ですが、 このプログラムは6枚の画像が切換えの対象になっていますが、 これが300枚とかになるとプログラムが増えて大変です。 GAZO[0] = new Image(50,50); GAZO[0].src = "0.jpg"; という風にしているところを var GAZO = new Array(); for(n=0; n<6; n++){ GAZO[n] = new Image(50,50); GAZO[n].src = "n.jpg"; } という風にすればできると思ったのですが、できませんでした。 n.jpgが""で囲まれて変数のnがただの文字列と見られているのかもと思い、 'GAZO[n] = new Image(50,50); GAZO[n].src = '+'"'+n+'.jpg'+'"'; このようにしてみましたがダメでした。 画像の枚数が何千枚になってもプログラムが増えない方法はありますか？ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title></title> <script type="text/javascript"> <!-- var Bifor = new Array(); Bifor[0] = new Image(50,50); Bifor[0].src = "befor0.jpg"; Bifor[1] = new Image(50,50); Bifor[1].src = "befor1.jpg"; Bifor[2] = new Image(50,50); Bifor[2].src = "befor2.jpg"; Bifor[3] = new Image(50,50); Bifor[3].src = "befor3.jpg"; Bifor[4] = new Image(50,50); Bifor[4].src = "befor4.jpg"; Bifor[5] = new Image(50,50); Bifor[5].src = "befor5.jpg"; function first(){ for(i=0; i<6; i++){ 'document.getElementById("after' + i + '").src' = Bifor[i].src; } } var GAZO = new Array(); GAZO[0] = new Image(50,50); GAZO[0].src = "0.jpg"; GAZO[1] = new Image(50,50); GAZO[1].src = "1.jpg"; GAZO[2] = new Image(50,50); GAZO[2].src = "2.jpg"; GAZO[3] = new Image(50,50); GAZO[3].src = "3.jpg"; GAZO[4] = new Image(50,50); GAZO[4].src = "4.jpg"; GAZO[5] = new Image(50,50); GAZO[5].src = "5.jpg"; function change(m){ 'document.getElementById("after' + m + '").src' = GAZO[m].src; } //--> </script> </head> <body onload="first()"> <form name="jirei" action="#"> //actionは必須。しかしに他に入れるものがないので便利な#を入れる <GAZO src="title.jpg"> <table> <tr> <td><img src="befor0.jpg" width="50" height="50" id="after0" onclick="change(0)"></td> <td><img src="befor1.jpg" width="50" height="50" id="after1" onclick="change(1)"></td> <td><img src="befor2.jpg" width="50" height="50" id="after2" onclick="change(2)"></td> </tr> <tr> <td><img src="befor3.jpg" width="50" height="50" id="after3" onclick="change(3)"></td> <td><img src="befor4.jpg" width="50" height="50" id="after4" onclick="change(4)"></td> <td><img src="befor5.jpg" width="50" height="50" id="after5" onclick="change(5)"></td> </tr> </table> <input type="button" value="元に戻す" onclick="first()"> </form> </body> </html>
- ベストアンサー
- JavaScript
- JavaScriptに関する簡単な質問です。
<script> var image1=new Image(); image1.src = "image/ny.jpg"; var image2=new Image(); image2.src = "image/tokyo.jpg"; var i = 1; function change(){ if(i==1){ element.src=image2.src; i=2; }else{ element.src=image1.src; i=1; } } </script> <img id="photo" src="image/ny.jpg" /> <script> var element = document.getElementByid("photo"); element.onclick=change; </scropt> オンクリックで画像が切り替わるというスクリプトなのですが、 new Image() というのは new date() と言うのと関係しているのでしょうか。 var i=1 と言うあたりからよくわからなくなってしまいます。 最後のelement.onclick=change;と言うのもよくわかりません。 スクリプトを平易な日本語で、簡単に説明してもらえるとありがたいです。 よろしくお願いします。
- 締切済み
- JavaScript
- DOM 属性の取得
下記は画像などのスライドのスクリプトです。 スライドの後のほう、つまり順番の最後にあたる9番目で http://www.trape3.com/ban.htmlへのリンクを貼っています。 そのリンクを外した上で、 <img>を入れなおしています。 つまり、 1) <img src="image02/ani001.jpg" name="anime"> へのリンクを貼る。 →その結果このようになる。 <a href="http://www.trape3.com/ban.html"><img src="image02/ani001.jpg" name="anime"></a> 2) その次に 上記の全体をremoveする。 3) その上で、<img src="image02/ani001.jpg" name="anime"> を置きなおす。 という操作をしていますが、そこで問題。 この最後の9場面が終了して、ふたたび一番目に戻って、そこでスライドが止まってしまいます。 理由は、 1) name="anime" を取得できない。 2) あるいは、 name="anime" が存在していない。 どちらかだと思われます。 というのは、 document.anime.src の代わりに document.getElementById('bb01').firstChild.src とすると、動きが止まらないで継続していくからです。 ということで、 name="anime" はどうなってしまったのか。 この部分の操作に関するスクリプトは 次のとおりです。 imageTag=document.createElement('img'); imageTag.setAttribute('name','anime'); imageTag.setAttribute('src','image02/ani001.jpg'); document.getElementById("bb01").appendChild(imageTag); imgエレメントを作成し、そこに 属性としてのname="anime"を置くということですね。 本に書かれてあるとおりです。(笑 この置いたはずの name="anime" が効いていない、どうしてなのかという質問です。 よろしくお願いします。 ------------------------------------------- スクリプト ■htmlファイル <body onload="timerID=setTimeout('change()',5000)"> <div style="position: absolute; top: 220px; left:80px" id="bb01"><img src="image02/ani001.jpg" name="anime" alt="アニメ"></div> ■jsファイル image1=new Image(); image1.src="image02/ani001.jpg"; image2=new Image(); image2.src="image02/ani002.jpg"; image3=new Image(); image3.src="image02/ani003.jpg"; image4=new Image(); image4.src="image02/ani004.jpg"; image5=new Image(); image5.src="image02/ani005.jpg"; image6=new Image(); image6.src="image02/ani006.jpg"; image7=new Image(); image7.src="image02/ani007.jpg"; image8=new Image(); image8.src="image02/ani008.jpg"; image9=new Image(); image9.src="image02/150.jpg"; function change() { clearTimeout(timerID); if(document.anime.src==image1.src) document.anime.src=image2.src; else if(document.anime.src==image2.src) document.anime.src=image3.src; else if(document.anime.src==image3.src) document.anime.src=image4.src; else if(document.anime.src==image4.src) document.anime.src=image5.src; else if(document.anime.src==image5.src) document.anime.src=image6.src; else if(document.anime.src==image6.src) document.anime.src=image7.src; else if(document.anime.src==image7.src) document.anime.src=image8.src; else if(document.anime.src==image8.src) { document.getElementById('bb01').removeChild(document.getElementById('bb01').firstChild); document.getElementById("bb01").innerHTML = "<a href=\"http://www.trape3.com/ban.html\">" + "<img src=" + "\"" + image9.src + "\"" + "width=\"100px\"" + "name=\"anime\"" + "\">" + "</a>"; } else { document.getElementById('bb01').removeChild(document.getElementById('bb01').firstChild); imageTag=document.createElement('img'); imageTag.setAttribute('name','anime'); imageTag.setAttribute('src','image02/ani001.jpg'); document.getElementById("bb01").appendChild(imageTag); } timerID=setTimeout("change()",5000); }
- ベストアンサー
- JavaScript
- JavaScriptの記述が長い
ホームページビルダー11でJavaScriptものの記述がとても長くなっています。HPBが、ホームページビルダーの略だとは思われますが、 この中で削除しても影響のない記述はありますでしょうか？ 多少でもサイトの読み込み速度を早くしたいと考えています。 宜しくお願いいたします。 /////////////////////////////////////////////////////////// <SCRIPT language="JavaScript"> <!--HPB_SCRIPT_ROV_50 function HpbImgPreload() { var appVer=parseInt(navigator.appVersion); var isNC=false,isN6=false,isIE=false; if (document.all && appVer >= 4) isIE=true; else if (document.getElementById && appVer > 4) isN6=true; else if (document.layers && appVer >= 4) isNC=true; if (isNC||isN6||isIE) { if (document.images) { var imgName = HpbImgPreload.arguments[0]; var cnt; swImg[imgName] = new Array; for (cnt = 1; cnt < HpbImgPreload.arguments.length; cnt++) { swImg[imgName][HpbImgPreload.arguments[cnt]] = new Image(); swImg[imgName][HpbImgPreload.arguments[cnt]].src = HpbImgPreload.arguments[cnt]; } } } } function HpbImgFind(doc, imgName) { for (var i=0; i < doc.layers.length; i++) { var img = doc.layers[i].document.images[imgName]; if (!img) img = HpbImgFind(doc.layers[i], imgName); if (img) return img; } return null; } function HpbImgSwap(imgName, imgSrc) { var appVer=parseInt(navigator.appVersion); var isNC=false,isN6=false,isIE=false; if (document.all && appVer >= 4) isIE=true; else if (document.getElementById && appVer > 4) isN6=true; else if (document.layers && appVer >= 4) isNC=true; if (isNC||isN6||isIE) { if (document.images) { var img = document.images[imgName]; if (!img) img = HpbImgFind(document, imgName); if (img) img.src = imgSrc; } } } var swImg; swImg=new Array; ここにはロールオーバー類記載 HpbImgPreload('_HPB_ROLLOVER2', 'banner/618-115.jpg', 'banner/618-115.jpg'); //--> </SCRIPT>
- 締切済み
- JavaScript
- IE11 javascriptについて
すみません、IE11なってから、以下のjavascriptが動かなくなりました。 画像は、フェードイン、フェードアウトを繰り返し、画像はランダムに移動します。 全部のロジックを書いてしまいましたが、 何処がIE11から変更されたかが解らなくて、困っている所です。 何処を直すのか、全部聞くのもあつかましいと思いました、 どのあたりを見直しすれば宜しいですか。 教えて頂ければ幸いです。 <SCRIPT language="JavaScript"> <!-- var img = new Array(); img[0] = new Image(); img[0].src = "img/4031.jpg"; img[1] = new Image(); img[1].src = "img/4032.jpg"; img[2] = new Image(); img[2].src = "img/4031.jpg"; img[3] = new Image(); img[3].src = "img/4032.jpg"; img[4] = new Image(); img[4].src = "img/4031.jpg"; imgMaxSizeW = 171; imgMaxSizeH = 141; alphaTimer = 10; stopTimer = 2000; nextImgTimer = 1000; _dom=(document.all?3:(document.getElementById?1:(document.layers?2:0))); function getWindowSize() { if(_dom == 1 || _dom == 2) { win_width = self.innerWidth; win_height = self.innerHeight; } if (_dom == 3) { win_width = document.body.clientWidth; win_height = document.body.clientHeight; } } function showLayer(layerName){ if (_dom == 1) document.getElementById(layerName).style.visibility = "visible"; if (_dom == 2) document.layers[layerName].visibility = "show"; if (_dom == 3) document.all(layerName).style.visibility = "visible"; } function hideLayer(layerName){ if (_dom == 1) document.getElementById(layerName).style.visibility = "hidden"; if (_dom == 2) document.layers[layerName].visibility = "hide"; if (_dom == 3) document.all(layerName).style.visibility = "hidden"; } function writeHTML(layerName,html) { if (_dom == 1) { var div = document.getElementById(layerName); while(div.hasChildNodes()) div.removeChild(div.lastChild); var range=document.createRange(); range.selectNodeContents(div); range.collapse(true); var cf=range.createContextualFragment(html); div.appendChild(cf); } if (_dom == 2) { var div = document.layers[layerName]; div.document.open(); div.document.write(html); div.document.close(); } if (_dom == 3) document.all(layerName).innerHTML = html; } function moveLayerTo(layerName, x, y){ if (_dom == 1) { document.getElementById(layerName).style.left = x + scrollX; document.getElementById(layerName).style.top = y + scrollY; } if (_dom == 2) { document.layers[layerName].left = x + pageXOffset; document.layers[layerName].top = y + pageYOffset; } if (_dom == 3) { document.all(layerName).style.pixelLeft = x + document.body.scrollLeft document.all(layerName).style.pixelTop = y + document.body.scrollTop; } } function changeAlpha(layerName) { if (_dom == 3) { if (alphaCount < 200) { alphaCount += 2; op = alphaCount > 100 ? 100 - (alphaCount-100) : alphaCount; document.all(layerName).filters["alpha"].opacity = op; if (op == 100) { tim = setTimeout("changeAlpha('"+layerName+"')", stopTimer); } else { tim = setTimeout("changeAlpha('"+layerName+"')", alphaTimer); } } else { hideLayer(layerName); clearTimeout(tim); tim = setTimeout("setAlphaImgPos()",nextImgTimer); } } else { setTimeout("setAlphaImgPos()",nextImgTimer*2); } } var imgCount = 0; function setAlphaImgPos() { writeHTML("imgLay",'<IMG src="' + img[imgCount].src + '" border="0">'); imgCount++; if (imgCount >= img.length) imgCount = 0; getWindowSize(); sX = Math.floor(Math.random()*(win_width-imgMaxSizeW-10)); sY = Math.floor(Math.random()*(win_height-imgMaxSizeH-10)); moveLayerTo("imgLay",sX,sY); showLayer("imgLay"); alphaCount = 0; changeAlpha("imgLay"); } window.onload = setAlphaImgPos; // --> </SCRIPT>
- ベストアンサー
- JavaScript
- ホームページの画像が表示されない
宜しくお願いします。 忍者ホームページの簡単ホームページでホームページを作りましたが画像が表示されず コメントだけの表示に成ります。 忍者ホームページにアップロードした画像ファイル名は一致しております 幾度試しましたが同じ状態です 下記のHTMLは間違って居りますでしょうか困って居ります <table align="right"> <tr><td><img src="img142.jpg"width="250" height="250"></td> <td><img src="img004.jpg"width="250" height="250"></td></tr> <tr align="center"><td bgcolor="#ffcccc">ハイブリットフリウス</td> <td bgcolor="#66cc66">フーガハイブリット</td></tr> <tr><td><img src="img013.jpg"width="250" height="250"></td> <td><img src="img889.jpg"width="250" height="250"></td></tr> <tr align="center"><td bgcolor="#cc9900">ポルシェカレラ</td> <td bgcolor="#9999cc">フェラリーモンディアル</td></tr> </table>
- ベストアンサー
- その他([技術者向] コンピューター)
お礼
うおー、できました！！まったく初心者なものでいろいろとつっこみどころはあると存知ますがとりあえず動いたので非常に嬉しいです。innerHTMLというメソッドを見て「これなのかなー」と思っていましたが使い方がよくわからないでいました。ほんとうにありがとうございました！！