画像をクリックし多数サイトから選んで新しくブラウザを開く方法は？
- ナビゲーションバーを作りたいが、画像をクリックしても新しいウィンドウが開かない。画像をクリックし、複数のURLから選択して新しいブラウザを開く方法を教えてください。
- HTMLのコードでナビゲーションバーを作成していますが、画像をクリックしてもページが遷移するだけで新しいウィンドウが開きません。画像をクリックして複数のURLから選択して新しいブラウザを開く方法を教えてください。
- 画像をクリックしてもページが遷移するだけで、新しいウィンドウが開きません。画像をクリックして複数のURLから選択して新しいブラウザを開く方法を教えてください。
- ベストアンサー
画像をクリックし多数サイトから選んで新しくブラウザを開く方法は？
お世話になります。 ナビゲーションバーを作りたいのですが、 下の方法だと、画像をクリックしてもホームページに移動はしますが、 新しくWindowが開きません。 画像をクリックすると、多数の中からURLを選択し、 新しくブラウザを開く形にしたいのですが、どのようにすればよいのでしょうか？ 下のものとまったく違う方法でもかまいません。 よろしくお願いします。 -------------------------- <html> <head> <script type="text/javascript"> <!-- urls = new Array() urls [1] = "a.html" urls [2] = "b.html" urls [3] = "c.html" var max=urls.length-1, place=0 function findthis() { thisURL=document.URL.toLowerCase(); for (var i=1; i<=max; i++){ if (thisURL==urls[i]) place=i; } } function go(where) { location = urls[where]; } function next() { findthis(); if (place==max) place=1; else place=place+1; go(place); } function previous() { findthis(); if (place<=1) place=max; else place=place-1; go(place); } function getRandom() { return Math.random() } function random() { findthis(); myrand=Math.round(getRandom()*(max)); if ((place==myrand) || (myrand==0)) random(); else { place=myrand; go(place); } } //--> </script> </head> <body> <Img src="previous.gif" onClick="previous()"> <Img src="next.gif" onClick="next()"> <Img src="random.gif" onClick="random()"> </body> </html>
- whoops101
- お礼率95% (139/146)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
ソースはざっとしか見てないけど、現在の表示はそのままで 新しくウインドウを開くなら、 function go(where) { location = urls[where]; } のことを function go(where) { open(urls[where]); } にすればできるよ。 open()の引数は最大３つまで指定できて、第１引数は開くファイルのパス、 第２引数はターゲット名、第３引数は新しく開くウインドウの状態の指定 だよ。
関連するQ&A
- クリックして変更した画像を他の画像をクリックしたとき戻すには？
以前、別で下記のような質問がありました。 ●質問－－－－－－－－－－－－－－－－－－－ 複数の同じ画像があるとします。 そのひとつをクリックすると画像が変わるようにします。 その後別の画像をクリックすると先ほどクリックした画像が初期の状態に戻るようにしたいのですが、どのような記述にすればよいのでしょうか？ どなたかご教授おねがいします。 －－－－－－－－－－－－－－－－－－－－－－ 上記の質問を受けての回答が下記のような感じで ●回答－－－－－－－－－－－－－－－－－－－ <script> function change(obj){ var orgimg="a.gif"; var newimg="b.gif"; var imgs=document.getElementsByTagName('img') for(var i=0;i<imgs.length;i++){ if(imgs[i].className==obj.className){ if(imgs[i]==obj) imgs[i].src=newimg; else imgs[i].src=orgimg; } } } </script> <img src="a.gif" class="hoge" onClick="change(this)"> <img src="a.gif" class="hoge" onClick="change(this)"> <img src="a.gif" class="hoge" onClick="change(this)"> －－－－－－－－－－－－－－－－－－－－－－ これで終わってしまっていたのですが、画像が複数のパターンある場合はどのようにすればよいでしょうか。 例えば 「a1.gif」をクリックすると「a2.gif」に変更するようにして、さらに「b1.gif」というものがあって、クリックすると「b2.gif」に変更するように設定してあるとします。 「a1.gif」をクリックして「a2.gif」になっている状態で「b1.gif」をクリックすると「a2.gif」が「a1.gif」に戻るようにするにはどのようにすればよいでしょうか。 このb1が、c1,d1,e1・・・・とたくさんある感じです。 質問の内容がわかりづりかもしれませんが、どなたかご教示いただけると幸甚です。 宜しくお願い申し上げます。
- ベストアンサー
- JavaScript
- onclickで呼び出す関数の引数を・・・
質問させていただきます。 prototype.jsを使って, function hoge(){ AJAXで画像ファイル名img_name[i]を取得、 取得画像が無ければimg_name[i]はnull; for(i=1;i<5;i++){ if(img_name[i]){ $("img_"+i).onclick=function(){sample(i)}; $("img_"+i).src=img_name[i]; }else{ $("img_"+i).onclick=null; $("img_"+i).src="no_img.gif"; } } } function sample(row){ 略; } という関数を作り、 htmlに <img id="img_1" src="aa.gif" onclick=""> <img id="img_2" src="bb.gif" onclick=""> というAJAXの結果で画像リストが変化し、画像がクリックできる プログラムを作りました。 しかしsampleに入ってくる引数が、どの画像をクリックしても iの最大値４になってしまいます。 予定ではクリックした画像によって引数が変わるはずなのですが・・・ どなたかご教授できる方宜しくお願い致します。
- ベストアンサー
- JavaScript
- javascriptでの画像の先読みについて（その２）
その１からの続きです。。 以下が私の作ったソースです。 <script language="JavaScript"> <!-- var flag=new Array(); var image=new Array(); var img=new Array(); // gif画像の先読み img[0]=new Image();img[0].src="透明gif"; img[1]=new Image();img[1].src="上向き矢印.gif"; img[2]=new Image();img[2].src="矢印の線.gif"; img[3]=new Image();img[3].src="下向き矢印.gif"; var on_mouse=144; for (i=0;i<144;i++) {flag[i] = 0;} function on_image(num){ on_image_no = num; //マウスの位置(0～143) } function off_image(num){ on_image_no = 144; //範囲外 } function mouse_click(){ flag[on_image_no]=(flag[on_image_no]==0); var image_no=0; for(i=0;i<144;i++){ if(flag[i]){ //フラグが立っていたら矢印の始点or終点を表示 if(image_no==0){ document.image[i].src=img[1].src; //上向き矢印 image_no=2; //次から矢印の線を表示 }else{ document.image[i].src=img[3].src; //下向き矢印 image_no=0; //次から透明なgifを表示 } }else{document.image[i].src=img[image_no].src;} } } //--> </script> ＃関係ないですけど、off_image()はいらないかも…。 以上、質問が長くなってしまって大変恐縮ですが、どなたか私をお助けください。 よろしくお願いいたします。 関連URL:http://oshiete1.goo.ne.jp/kotaeru.php3?q=319633
- ベストアンサー
- JavaScript
- 画像をクリックして別の画像を変えたい
ボタン画像をクリックしたときに同一ページ内にある画像が変わるようにしたいのですが、下のように描くと、ボタン画像（button.gif)自身が2.pngなどの画像に変わってしまいます。 <HTML> <HEAD> <TITLE>スワップイメージ</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function changeImage(imageUrl){ document.images[0].src = imageUrl; } // --> </SCRIPT> </HEAD> <BODY> <A HREF="#" onClick="changeImage('1.png')" ><IMG SRC="button.gif" border="0"></A> <A HREF="#" onClick="changeImage(2.png')" ><IMG SRC="button.gif" border="0"></A> <A HREF="#" onClick="changeImage(3.png')" ><IMG SRC="button.gif" border="0"></A> <TABLE BORDER="0"> <TR> <TD>ボタンを押すと下に画像が表示されます。</TD> </TR> <TR> <TD><IMG SRC="1.png"></TD> </TR> </TABLE> </BODY> </HTML> 原因を私なりに考えたところ、設定した変数mageUrlをボタンを表示させるために使った<img src="button.gif">で受け取ってしまっているというのはわかりました。（確認のため <IMG SRC="1.png"> を<A HREF>～</A>より上に持ってきたら思っていた動きになりました。） けれどそれからどう修正したらもとの順番でもちゃんと動くのかがわかりません。過去ログの似た質問も拝見したのですが、今の自分では理解できませんでした‥。すみませんがよろしくお願いいたします。
- ベストアンサー
- JavaScript
- クリックしたら画像がやってくる
<div id="gotolist" style="position:absolute;top:150;left:10"> <img src="kabe2.gif"> </div> <script language="javascript"> <!-- document.onclick=ko; function ko() { gotolist.style.posTop=event.y; gotolist.style.posLeft=event.x; alert(event.x+";"+event.y); } //--> </script> と言うプログラムを作ったのですが、ページ上で<img src="kabe2.gif">が画面から見えなくなったときクリックをするとその場所にやってこずにalertでクリックした位置だけ正常に出ます <img src="kabe2.gif">が見えるところまで戻るとevent.x位だけが正常でevent.y位はうまくいかないのですが何故でしょうか？ 何故だかわからずに困っています。 よろしくお願いします。
- ベストアンサー
- JavaScript
- かぶらないランダム画像
こんにちは。 現在ランダムに画像表示＋画像毎に各リンク＋マウスオーバーで画像切り替え を下記スクリプトで行っております。 function randomImage1() { img = new Array(); img[0] = "photo1.gif"; img[1] = "photo2.gif"; img[2] = "photo3.gif"; img[3] = "photo4.gif"; n = Math.floor(Math.random()*2); url = 'URL1 URL2'.split(' '); document.write('<a href="'+url[n]+'" target="_top"><img src="'+img[n]+'" border="0" onMouseOver="this.src=\''+img[n-0+2]+'\'" onMouseOut="this.src=\''+img[n]+'\'" onClick="location.href=\''+url[n]+'\'"></a>'); } ここで相談です。さらにこのソースを改造して 重複しないでランダムに画像表示させたいのですが、 どこをどう改造すれば良いかアドバイス宜しくお願い致します。
- ベストアンサー
- JavaScript
- 1*1の透過gifを別画像に変更する方法
アマゾンWEBサービスを使ってデータをアマゾンからとってくるプログラムを書いています。 アマゾンで商品画像が用意されていないやつは1*1の透過gifへのリンクが張られています。 この透過gifを自作の"NO IMAGE"のgif画像にjavascriptで変更したいのです。 下記のようなスクリプトがあったのでこれを利用しようとおもってるのですが、どうもclass="side"をいれると正常に動作しないのですがなぜでしょう？ このCSS記述がなければ正常に動作するのですが、これはわけあってはずすことができません。 ---------------------------------------- <img src="商品画像のURL" onload="replaceImage(this)" class="side" /> ---------------------------------------- ---------------------------------------- function replaceImage(img) { if (img.width == '1' && img.src.match(/\.01\./)) { img.src = 'img/no_img.gif'; } else if (img.width == '1') { img.src = img.src.replace('.09.','.01.'); } } ---------------------------------------- どなたか、良い解決方をご教授いただけますようお願いいたします。
- ベストアンサー
- JavaScript
- JavaScript 時間ごとに画像を変える。
JavaScriptで時間ごとに画像を変える様にしたいのですが、 画像が表示されません(T_T) どこが間違っているのでしょうか？ function setImg(){ var gTime02 = (new Date()).getHours(); var arImg = new Array("9_12.gif","13_15.gif","16_18.gif","19_08.gif"); function ifImg(){ if(gTime02 >= 9 && 12 >= gTime02){ arImg[0]; }else if(gTime02 >= 13 && 15 >= gTime02){ arImg[1]; }else if(gTime02 >= 16 && 18 >= gTime02){ arImg[2]; }else {arImg[3];} } document.write("<img src='images/"+ifImg+"' border='0' width='150' height='60'>"); }
- ベストアンサー
- その他([技術者向] コンピューター)
- リロードするまでの間のクリック数をカウントして表示
重ね重ね質問すいません。 先ほど、『リンクボタンからインラインフレーム内にクリックするたび順番に別のサイトに飛ばすようにするにはどうしたらよいでしょうか？※ランダムではなくあらかじめ決めた順番で飛ばしたいです できるならソースを教えてください』。 という質問をして↓の答えを頂いたのですが、更にこれにリロードするまでの間のボタンのクリック数をカウントしてリアルタイムで表示したいのですがなにを付け加えたらよいでしょうか？※リロード行われたらリセットでお願いします <script> var urls=["ttp://okwave.jp/","ttp://oshiete.goo.ne.jp","ttp://qanda.rakuten.ne.jp"]; var idx=0; function clickFunc(){ idx=idx<urls.length -1?idx+1:0; document.getElementById("hoge").src=urls[idx]; } window.onload=function(){ document.getElementById("hoge").src=urls[0]; } </script> <input type="button" onclick="clickFunc()" value="go"> <hr> <iframe src="" id="hoge" width=80% height=500px;></iframe>
- ベストアンサー
- JavaScript
- 画像メニューの開閉
JavaScriptで画像メニューの開閉を行いたいのですが、 うまく動きません。 「aaa」が閉じていた場合には「aaa」を開くまではできたのですが、 「bbb」を閉じるという１行を追加したら動かなくなりました。 どなたかご教授願います。 【JavaScript】 function showSubmenu01() { if(document.getElementById("aaaSub").innerHTML == '') document.getElementById("aaaSub").innerHTML = '<img src="aaa.gif">'; document.getElementById("bbbSub").innerHTML = ''; else document.getElementById("aaaSub").innerHTML = ''; } 【HTMLソース】 <ul> <li><a href="#" onClick="showSubmenu01()"><img src="img/menu_aaa.gif" /></a></li> <li><div id="aaaSub"></div></li> <li><div id="bbbSub"><img src="bbb.gif" /></div></li> </ul>
- ベストアンサー
- JavaScript
お礼
迅速で的確な回答、ありがとうございます！！ 本当に助かりました。 ありがとうございましたっ。