• 締切済み

画像をランダムにスクリプト

ホームページをHTMLで作成しております。画像をランダムにスクリプトしてますが、画像のサイズが大きすぎるので、HTMLでサイズ変更する場合の、HTMLをご教授ください。 width="300" height="200"を挿入でいいのでしょうか。 その場合の挿入箇所をお教えください。 現在、下記のHTMLを作成しております。 <script language="JavaScript"> <!-- var image=new Array (); image[0]="s/b/bike1.jpg" ; image[1]="s/h/hatake207.jpg"; var rnd=Math.floor(Math.random()*image.length); document.write(" <img src=' "+image[ rnd ]+ " '> "); //--> </script> 宜しくお願いします。

  • HTML
  • 回答数2
  • ありがとう数2

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

回答とは関係なくてすみませんが(回答はもう出ているので)・・・ >画像のサイズが大きすぎるので HP上での表示だけが目的であれば、表示サイズ以上の画像を置いておくのは、表示のために要する時間を遅くするだけです。 (全てのユーザが環境が良いと限りませんので。) 他の使用目的がない場合は、できるだけコンパクトなサイズにしておいてアップすることをお勧めします。 いらぬお節介で失礼しました。

gorugo48
質問者

お礼

遅くなりました。 ありがとうございました。

  • pu--n
  • ベストアンサー率56% (32/57)
回答No.1

こんにちわ。 document.writeを以下のようにすれば300*200の大きさに表示されるはずですが・・・ document.write(" <img src=" +image[ rnd ] + " width=\"300\" height=\"200\">");

gorugo48
質問者

お礼

遅くなりました。 ありがとうございました。

関連するQ&A

  • ブログトップにランダムで画像を表示させる方法

    ブログのトップに画像をランダムで表示させたいと思っています。 テンプレートはfc2の共有プラグインのsimple04を使っています。 <script language=”JavaScript”> var images = new Array(); /* 画像URLを表示させたい分だけ書き込むこと */ images[0] = “”; images[1] = “”; images[2] = “”; images[3] = “”; images[4] = “”; images[5] = “”; images[6] = “”; var rnd = Math.floor((Math.random() * 100)) % images.length; document.write(‘<img src=’,images[rnd],’ border=”0″>’); </script> 自分で調べてみてこのタグを使えばいいことはわかったのですが、 HTMLの所に貼るのかCSSのところに貼るのかわかりません。 回答よろしくお願いします。

  • javascript 画像切り替え ランダム 順番

    インラインフレーム内のランダムな画像切り替えはできたのですが、順番に切り替えていくというのが出来ません。。。 ランダムソース var imglist=new Array( "100_0003.jpg", "100_0006.jpg", "100_0008.jpg", "100_0009.jpg", "100_0021.jpg", "100_0022.jpg", "100_0023.jpg", "100_0025.jpg", "100_0001.jpg" ); var selectnum=Math.floor((Math.random()*100))%imglist.length; var output="<IMG src=images/randomimg/"+imglist[selectnum]+">" ; document.write(output); 順番ソース var imglist=new Array( "100_0003.jpg", "100_0006.jpg", "100_0008.jpg", "100_0009.jpg", "100_0021.jpg", "100_0022.jpg", "100_0023.jpg", "100_0025.jpg", "100_0001.jpg" ); var selectnum=imglist.length-1; var i=0; function forward() { i=selectnum--; var output="<IMG src=images/randomimg/"+imglist[i]+">" ; document.write(output); } テキストリンクを押してインラインフレーム内の画像を変更していきたいのですが。。。順番にすると真っ白になってしまいます。。。 どなたか解決方法よろしくお願いします。

  • 背景画像のランダム表示

    お世話になります。 PHP勉強中です。 1.背景画像のランダム表示:bodyタグ内でなくdiv内の背景画像を変更したい。bottom right指定等施したいのでスタイルシートで書き出す?? 2.確率を設定したい:1枚の基本画像が60%表示され、それ以外の複数の画像が40%で選択、その中で画像をランダムに設定したい。 3.使用する画像は同一フォルダ内にある、背景画像以外はいれない。今後枚数を増やしていく予定なので、ファイル名を1つずつ指定するのではなく、フォルダ内の画像を読んで、配列に・・・ と、やりたいことはあるのですが、どうやったらいいのやら・・・頭が混乱してます(汗) 私のサイトに訪問される方でjsをOFFにされている方が多少いらっしゃるので、どうせならPHPで!と意気込んでみたのですが・・・ もしよろしかったらご教授下さいませ。 よろしくお願い致します。 参考:現在設置のjsファイル <script> wall = new Array(); wall[0] = "./image/bg01.jpg"; wall[1] = "./image/bg02.jpg"; wall[2] = "./image/bg03.jpg"; wall[3] = "./image/bg04.jpg"; wall[4] = "./image/bg05.jpg"; wall[5] = "./image/bg06.jpg"; wall[6] = "./image/bg07.jpg"; wall[7] = "./image/bg08.jpg"; rnd = Math.round(Math.random() * (wall.length - 1)); document.write('<style type="text/css">div.mainTOP { background:url(' , wall[rnd] , ') no-repeat bottom right #FAFAFA; }</style>'); </script>

    • ベストアンサー
    • PHP
  • 画像をランダムに

    JavaScript初心者です。回答していただければさいわいです。 初心者といってもタグサイトからコピペしていじくるだけの者ですが。 画像をランダムに表示したいと思いJavaScriptを使用したのですが うまく表示させることができません。 画像自体表示していないことになってしまいます。 画像を表示させたい部分に <SCRIPT language="JavaScript"> <!-- // img = new Array(); img[0] = "t/1.jpg"; img[1] = "t/2.jpg"; img[2] = "t/3.jpg"; img[3] = "t/4.jpg"; img[4] = "t/5.jpg"; n = Math.floor(Math.random()*img.length); document.write("<img src='"+img[n]+"' border='0'>"); //--> </SCRIPT> とタグをうっているのですが、なにか足りないところがあるのでしょうか?

  • html内かscript内で画像出力。どちらが軽い

    ホームページの読み込みは、画像を使えば使うほど重くなってしまいます。 下記コードでは、(1)と(2)で1.jpg~5.jpgの画像をページに出力しています。 (1)はHTMLに、(2)はscript内に、 (1)と(2)では(2)の方がhtmlに<img src=".jpg" width="800" height="300"/> と書かなかった分、ページが重くならない、ということになりますか? <html> <head> <title>HTML上に直接imgを出力した場合</title> </head> <body> <img src="1.jpg" width="800" height="300"/> <img src="2.jpg" width="800" height="300"/> <img src="3.jpg" width="800" height="300"/> <img src="4.jpg" width="800" height="300"/> <img src="5.jpg" width="800" height="300"/> </body> </html> <html> <head> <title>HTML上にはimgを出力せず、script内でimgを出力した場合</title> <script language="JavaScript"> var imgSanple = new Array( "1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg"); var randomSelect = Math.floor((Math.random() * 100)) % imgSanple.length; var i = "<img src='"+imgSanple[randomSelect]+"' width='800' height='300'>"; document.write(i); // --> </script> </head> <body> <noscript> <img src="1.jpg" width="800" height="300"> </noscript> </body> </html>

  • javaScriptでリンク画像のランダム更新表示

    画像をランダム表示する方法はわかったのですが、 各画像にリンク設定したいのと、 各画像の大きさをCSSのwidthやhighのように調整する方法をご教授ください。 <html> <body> <script type="text/javascript"> <!-- var imgURL = ["./images/1.jpg", "./images/2.jpg", "./images/3.jpg"]; var n = Math.floor(Math.random() * imgURL.length); document.write('<img src="'+imgURL[n]+'">'); // --></script> </body> </html>

  • 画像のランダム表示

    初心者です。。 画像のランダム表示で、下のものを使っているのですが、 画像の上にカーソルをもっていったときに手のマークにしたいのですが、 どのようにすればできるのでしょうか? onclickを使っているからだと思うのですが、 A href=を使えばできるのでしょうか? よろしくお願いします。 <script type="text/javascript"> <!-- var imgs = new Array; var n = 5; var i; for(i=0;i<n;i++){ imgs[i] = new Image(); } imgs[0].src="image/001.jpg"; imgs[1].src="image/002.jpg"; imgs[2].src="image/003.jpg"; imgs[3].src="image/004.jpg"; imgs[4].src="image/005.jpg"; function disp(img){ img.src=imgs[Math.round(Math.random()*(n-1))].src; } //--> </script> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> </head> <body> <div align="center"> <img src="image/001.jpg" border="0" onclick="disp(this)"> </div> </body> </html>

  • 画像をランダムに表示するには

    <script language=JavaScript> <!-- var img=new Array(); img[0]='画像1'; img[1]='画像2'; img[2]='画像3'; img[3]='画像4'; img[4]='画像5'; ran_gazo=Math.floor(img.length * Math.random()); document.write('<IMG SRC='+img[ran_gazo]+'>'); //--></script><!--scripted by shotyan@dreamcity--> というのを使いますよね?(あるサイトで見つけました)でも、画像があるべき場所に「×」がついて、画像が出ないんです・・ どうしたら画像がランダムに表示されるんでしょうか。 教えてください。 そして、その画像を右上に固定したいんです。 注文多くてごめんなさい。

  • ランダム表示に加えwidthをブラウザに合わしたい

    ホームページを作成しています。 5枚の画像からランダムで背景に表示する処理に加えて、選ばれた画像のwidthをブラウザに合わせて拡大・縮小したいです。 以下ソースのランダム表示の処理に加えて、ブラウザに合わせて画像を拡大・縮小して表示する方法を教えて下さい。 よろしくお願いします。 <SCRIPT language="JavaScript"> bgc = new Array(); bgc[0] = "url(../image/ti1.jpg)"; bgc[1] = "url(../image/bg2.jpg)"; bgc[2] = "url(../image/bg3.jpg)"; bgc[3] = "url(../image/bg4.jpg)"; bgc[4] = "url(../image/bg5.jpg)"; n = Math.floor(Math.random()*bgc.length); document.body.style.backgroundImage = bgc[n]; </SCRIPT>

  • 画像リンクをランダムに4つ表示する

    このようなタグを使って、画像リンクのランダム表示を作成しました。 ((hard内)) <script type="text/javascript"><!-- // var imglist = [ [ "画像1", "", "リンク先1" ] , [ "画像2", "", "リンク先2" ] ]; function RandomImageLink() { // var selectnum = Math.floor(Math.random() * imglist.length); // var output = '<a href="' + imglist[selectnum][2] + '">' + '<img src="' + imglist[selectnum][0] + '"' + ' alt="' + imglist[selectnum][1] + '"><br>' + imglist[selectnum][1] + '</a>'; // document.write(output); } // --></script> ((body内)) <script type="text/javascript"><!-- RandomImageLink(); // --></script> こうしてランダムに表示できるようになったのですが、私は『ランダムに1つ表示』ではなく、『ランダムに4つ表示』にしたいのです。 …どうすればいいのでしょうか? どなたか回答をお願いします。

専門家に質問してみよう