それぞれの画像をオンマウスのときに違う画像にしたい| OKWAVE

画像をランダムに表示し、リンクもランダムにしたい

下記の通りにしたら、ランダムに画像が表示され、クリックすれば画像とペアになっているアドレス先に飛ぶことは出来たのですがそのときのリンク先をランダムにすることは出来ないでしょか？例えば、img[2] の画像が表示された場合、jmp[2] ではなく５つのアドレスの中からランダムにリンク先が決まる、というようなことなんですが・・・。 // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://～"; jmp[1] = "http://～"; jmp[2] = "http://～"; jmp[3] = "http://～"; jmp[4] = "http://～"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/img1.jpg"; img[1] = "img/img2.jpg"; img[2] = "img/img3.jpg"; img[3] = "img/img4.jpg"; img[4] = "img/img5.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"' target='_blank'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>");

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

お世話になります。 JavaScript初心者ですが、フリーソースなどを見つつ勉強しております。下記のようなhtmlに【js00】と【js01】を読み込んでサムネイル画像をオンマウス時に上部に拡大表示させているのですが、サムネイル画像と拡大表示画像の両方に指定リンクをつけようとしています。記述４の【js02】のような画像をランダム表示して指定リンクをつけるScriptは発見できたのですが、これを記述１+２+３と組み合わせられず、作業が進まなくなってしまいました…。フリーソースを応用しようとしすぎて、遠回りな記述になっているかもしれませんが、もし分かる方がいらっしゃったら教えて頂けないでしょうか？ ■記述１(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> ■記述２(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]; } ■記述３(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>" ) ; } ■記述４(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"　で開きたい以上がご質問内容です。初心者で大変恐縮ですが、どうぞよろしくお願いいたします。

JSを用いてサイトを開いた際にランダムでバナー表示する仕組みを作りたい

JSを用いてサイトを開いた際にランダムでバナー表示する仕組みを作りたいと思っているのですが、 2のバナーの時には別窓で開き1のバナーの時はセルフで開くような設定を施す場合はどの用に書けばいいでしょうか？一応いろいろと調べて下記までは書いてみたのですが。。。うまく動きません。。。どなたか助けていただけませんでしょうか？よろしくお願いします。 <SCRIPT language="JavaScript">  </SCRIPT>

外部ファイルにしたら文字化けしてしまいました

ＦＣ２ブログで下記【１】を <script type="text/javascript">  </script> で囲んで直接プラグインに書き込んだら文字化けせずに表示されたのですが、外部ファイルにして <script type="text/javascript" src="【１】のJSファイルのパス"></script> をプラグインに書き込んだら、画像リンクはうまく表示されたのですが、文字化けしてしまいました。文字化けしない方法はないでしょうか？【１】 // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://～"; jmp[1] = "http://～"; jmp[2] = "http://～"; jmp[3] = "http://～"; jmp[4] = "http://～"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/img1.jpg"; img[1] = "img/img2.jpg"; img[2] = "img/img3.jpg"; img[3] = "img/img4.jpg"; img[4] = "img/img5.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"' target='_blank'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>");

ランダム表示

某サイトで　このようなスプリクトを手に入れたのですが設置した際に　横310Ｘ縦190と言う　表示画像サイズの指定の仕方がわかりません　いろいろ　試したのですが　素人のため　なかなか　うまくいきません　下のスプリクトにどこにどのようなタグを入れていいのか教えてください　皆様お力を貸してください <SCRIPT language="JavaScript">  </SCRIPT>

1万個からランダムリンクさせるには？

1万個からランダムリンクさせたいのですが、 jmp〔０〕からjmp〔１００００〕まで作ってしまうと異常にソースが長くなり、読み込みが長くなってしまいました。軽量化して読み込みを早したいのですが、いい方法はないでしょうか？使用したソースですプログラム初心者ですので具体的に書いていただけるとうれしいです。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY bgcolor="#ffffff"> <SCRIPT language="JavaScript">  </SCRIPT> </BODY> </HTML>

一定時間で画像とリンク先を変換する

DreamWeaverCS3でHPを製作しております、まだ初心者です。リンクが設定してある画像を一定時間で変換していき、なおかつリンク先のページをポップアップウィンドウで開こうとしています。下記コードでポップアップウィンドウは開くのですが一定時間での変換がうまくいきません。どなたかご教授頂けませんでしょうか。宜しくお願い致します。 <SCRIPT language="JavaScript">  </SCRIPT>

ランダム表示画像へ説明文を表示したい。

ランダムな画像表示に対しそれぞれへの個別リンク設定をし、個々の画像にカーソルを重ねた時に説明文を表示するようにしようと思っています。画像とリンクはうまくいっているのですが説明文が表示されません記述は下記のようにしました。間違っているところを訂正していただけないでしょうか、お願いします。 <script language="JavaScript">  </script>

target="new"を書き込む場所

私はあるサイトを作成しているのですが、そのサイトのトップページで静止画像をランダムに表示させています。更新ボタンを押すたびに静止画像が変わるというものです。そしてその静止画像をクリックすると、ある特定のホームページにリンクしています。下記はそのソースです。この静止画像をクリックしても、タブをもう一つ開いてリンクしていません。同じタブで切り替わるだけです。HTMLでしたら、target="new"になっていないということです。そこでお聞きしたいのですが、下記のJavaScriptでtarget="new"にするにはどこにこれを書き込めばいいのでしょうか？また、サイトを開くたびにランダムに静止画像を表示させるだけでなく、静止画像を数秒ごとに切り替えるソースをご存知の方がいらっしゃいましたら、ぜひご教授ください。よろしくお願いします。  <SCRIPT language="JavaScript">  </SCRIPT>

ランダムバナーのリンク先をポップアップウィンドウで開きたい。

ランダムバナーのリンク先をポップアップウィンドウで開きたい。当方javascript初心者なのですが、色々なサイトを参考にして上記の方法を模索しています。以下に記載する内容で画像をランダムに表示するところまで出来たのですが、画像をクリックすると通常通り、リンク先に飛ぶだけでポップアップウィンドウが開きません。この記述の間違い点、問題点をご指摘、助言をいただきたく思います。よろしくお願いたします。以下js記述↓ <SCRIPT language="JavaScript">  </SCRIPT>

画像がページによって表示されません

http://small-office.net/のサイトの画像の表示で困っています。ヘッター右上部分に、ジャバスクリプトで更新するたびに切り替わる画像を設置しました。トップページやhttp://small-office.net/search.htmlのページではうまく画像が表示されるのですが、 http://small-office.net/list/osaka.htmlのページだと画像が表示されません。階層が違うからなのか…。 JavaScript の知識がなく、JavaScript のソースはwebで調べてコピーして使いました。下はジャバスクリプトのソースです。 // JavaScript Document <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://jishusitu.com/"; jmp[1] = "http://co-work-ing.com/"; jmp[2] = "http://thai-kosiki.net/"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/common/bnr-ad-header1.png"; img[1] = "img/common/bnr-ad-header2.png"; img[2] = "img/common/bnr-ad-header3.png"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"' target='_blank'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>"); http://small-office.net/list/osaka.htmlでも画像を表示するにはどうしたらいいのでしょうか？どうぞよろしくお願いします。

更新ごとに重複しない画像を5枚表示

初心者です。よろしくお願い致します。複数ページ存在するうちの、各ページを更新するごとにランダムに変わる、重複しない5枚の画像を表示させたいと思います。今現在、サイト上に掲載されてあったJavaScriptのサンプルを自分なりに変更してテストしているのですが、「重複しない」というところで壁にぶち当たってしまっています。下記が現在のスクリプトです。 <body> <script language="JavaScript"></script> </body> 現在では、画像枚数が8枚ですが、4、50枚に増える予定です。また、スクリプトを書きやすくするために画像ファイルの名前をどのように変更してもかまわないと思っています。上記のスクリプトは5枚の画像が表示されることはされるのですが、更新してから表示するまでの待ち時間が長いのが気になるので、できれば、欲を言うならば、早く表示してくれるようなスクリプトをご伝授していただければと思います。よろしくお願い致します。

画像がうまく表示されないのですが

ページを見るごとにランダムで画像が変わるタグを書き込んだのですが・・・タグ１ <script language="JavaScript">  </script> タグ２ <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> タグ１はインフォシークのサーバーでは表示されたのですが、A-RINGSのサーバーでは表示されなかったので、サーバーの問題で表示されないのでしょうか？表示されないとしたらどのようにしたら表示されるものなのでしょうか？タグ２はどちらのサーバーも表示されませんでした。どうしたらちゃんと表示されますでしょうか？

ランダム画像＆マウスオーバーで画像切り替え

こんばんは。下記内容を外部JSファイルにしたいのですがやり方がいまいちわかりません。 <script language="javascript">  </script> どなたかご教授頂けると助かります。よろしくおねがいいたします。

画像をランダムに

JavaScript初心者です。回答していただければさいわいです。初心者といってもタグサイトからコピペしていじくるだけの者ですが。画像をランダムに表示したいと思いJavaScriptを使用したのですがうまく表示させることができません。画像自体表示していないことになってしまいます。画像を表示させたい部分に <SCRIPT language="JavaScript">  </SCRIPT> とタグをうっているのですが、なにか足りないところがあるのでしょうか？

javascriptで画像のランダム表示設定

いつもお世話になっております。過去に類似した質問が挙げられてましたが、解決に至らなかったので、質問させて頂きます。 javascriptを使用して、３枚の画像をランダム表示されるように設定したいと思っております。できれば、更新毎に常に異なる画像が表示されるようにしたいです。ちなみに全体に適用ではなく、特定のボックスのみです。こんな感じで現在は指定しております。 <div class="section1"> <img src="photo/xxx.jpg" alt="xxx" /> </div> ここのimgをランダム表示にしたいのですが、どうも上手くいきません。 <script language="javascript">  </script> をbody内に挿入したのですが、ダメでした。ご指導の程宜しくお願い致します。ちなみに当方、プログラムを自力で記述する能力が無いので、できれば、ソースを明示して頂けると大変助かります。

ランダム画像 & マウスオーバー画像切り替え &

こんにちは。どうしてもわからない事がありますので質問させて下さい。下記ソースにてランダム画像切り替えとマウスオーバーにて画像変更を行ってます。 <script language="javascript">  </script> さらにマウスオーバー時の画像それぞれ個別にリンクを張りさらにそれをインラインフレーム内で表示するのでtarget="_top"の値を付け加えたいです。そのような事が可能であれば是非ご教授頂ければありがたいです。みなさま、よろしくお願い致します。

JavaScriptで制御して、更新ごとに画像変更してさらにリンクも飛ばす

前回お世話になりました。ありがとう御座いました。 line = 4; mes = new Array(4); mes[0] ='<img src="img/1.jpg">'; mes[1] ='<img src="img/2.jpg">'; mes[2] ='<img src="img/3.jpg">'; mes[3] ='<img src="img/4.jpg">'; Rnd = Math.floor(Math.random()*line); document.write(mes[Rnd]); コレに付随させて、画像クリックしたら、リンクに飛ぶようにしたいと思っております。どうしたらいいのかまったくわからないので、助けてください。宜しくお願いいたします。

java 曜日毎に画像切り替え _blank

曜日ごとに画像を切り替えするスクリプトに、リンク先を指定しています。そのリンクを別窓(target="_blank")にしたいのですが、反映してくれません。－－－－－－－－－－－－－－－－－－－－－－－－－－ var jmp = new Array(); var myimg = new Array(); jmp[0] = "URL1"; jmp[1] = "URL2"; jmp[2] = "URL3"; jmp[3] = "URL4"; myimg[0] = '<img src="画像1" alt="">'; myimg[1] = '<img src="画像2" alt="">'; myimg[2] = '<img src="画像3" alt="">'; var mynow = new Date(); var myweek = mynow.getDay(); document.write("<a href='"+jmp[myweek]+"'>" + myimg[myweek] + "</a>"); －－－－－－－－－－－－－－－－－－－－－－－－－－ javaの知識がまったくない初心者です。 document.writeの中に入れるのかなと思うのですが、別窓になりません。誰か分かる方がいましたら教えていただけないでしょうか？

JS：画像を繰り返しランダム読込すると途中で止まる

現状は、ページの読み込み時にランダムで2枚の画像を読み込んで、loadのたびに違う画像が表示されるようにしています。それをリロードせずに繰り返し画像を切り変えるように変更したく下記のように「setTimeout("getImg()",1000); 」を追加したところ、画像の切り替え8回目の切り替えあたりで止まってしまいます。（その際、2枚の画像が同じ画像になります。毎回同じ画像でなるわけではない）変数か何かをクリアすればいいような気はするのですが、初心者レベルのためわかりませんでした。原因わかる方いましたらご教示頂ければ幸いです。 javascript：img1111.js ------------------------ function getImg(str){ //ランダム function randNum(){ var randNum = Math.floor(Math.random()*img.length); return randNum; } //表示処理 if(str=="wide"){ var n = randNum(); setIMG = 'url(images/'+img[n][1]+')'; document.getElementById('inner_recomend').style.backgroundImage = setIMG; if(img[n][0]){ setURL = '<a href="'+img[n][0]+'" target="_blank"></a>'; }else{ setURL = ''; } document.getElementById('right_contents_rec').innerHTML = setURL; }else{ //画像とURL取得 function imgSet(id,n){ var setIMG = 'url(images/'+img[n][1]+')'; document.getElementById(id).style.backgroundImage = setIMG; if(img[n][0]){ setURL = '<a href="'+img[n][0]+'" target="_blank"></a>'; }else{ setURL = ''; } document.getElementById(id).innerHTML = setURL; } var n = randNum(); imgSet('right_contents_rec1',n); img.splice(n,1); var nn = randNum(); imgSet('right_contents_rec2',nn); } //次のタイマー呼びだし setTimeout("getImg()",1000); } ------------- htmlは下記 ------------- <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head> <body> <div id="swap"> <div id="select01"> <div id="inner_recomend"> <div id="right_contents_rec1"></div> <div id="right_contents_rec2"></div> </div> </div> </div> </body> <script type="text/javascript" src="img1111.js"></script> <script type="text/javascript"> var img = new Array(); //画像リストの設定 ('URL','画像ファイル名') img[0] = Array('http://www.000.co.jp/','15961.jpg'); img[1] = Array('http://www.000.co.jp/','15962.jpg'); img[2] = Array('http://www.000.co.jp/','15963.jpg'); img[3] = Array('http://www.000.co.jp/','15964.jpg'); img[4] = Array('http://www.000.co.jp/','15965.jpg'); img[5] = Array('http://www.000.co.jp/','15966.jpg'); img[6] = Array('http://www.000.co.jp/','15967.jpg'); img[7] = Array('http://www.000.co.jp/','15968.jpg'); img[8] = Array('http://www.000.co.jp/','15969.jpg'); // getImg(); </script> </html> ------------- よろしくお願いいたします。

それぞれの画像をオンマウスのときに違う画像にしたい

みんなの回答

関連するQ&A