dポイントプレゼントキャンペーン実施中！

ランダムに画像と文章を表示

解決済

  • 質問者：keroq
  • 質問日時：
  • 回答数：4件

バナーをクリックするたびに、ポップアップでランダムに画像と説明文を表示させたいのです。
A.B.Cの画像とa.b.cの文章があって、画像と文章の組み合わせは変えたく無いのです。
A画像＋a文章、B画像＋b文章、C画像＋c文章の組み合わせをランダムに表示させたいのですが、どのようにすればよいのでしょうか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (4件)

No.4ベストアンサー

  • 回答者： EUR
  • 回答日時：

do 以下の内容をコピーするとのことですが、ちょっとだけ修正を加えていただけないでしょうか？



といいますのが、今回No1で書いたソースは、配列の要素数を気にしないように、固定の数を使わないようにしようとしていました。
・・・が、
if (random_num != 3) {
のところで「3」ともろに使ってしまっていました。

この部分を
if (random_num != Comments.length) {
と変更していただけないでしょうか。
よろしくお願いします。
    • good
    • 0
    • 件
通報する
この回答へのお礼

EURさん、わざわざありがとうございます！！！！
修正までしていただき助かりました。

通報する
お礼日時：2005/06/24 02:15

No.3

  • 回答者： m035
  • 回答日時：

<html>


<head>
<script type="text/javascript">
<!--
var W;
function sample() {
　　var num=Math.floor(Math.random()*3);//乱数の生成
　　var com;//コメントを入れる器
　　var imgsrc;//イメージのsrcを入れる器
　　if(num==0){
　　　　imgsrc="画像１.jpg";
　　　　com="コメント１";
　　}
　　else if(num==1){
　　　　imgsrc="画像２.jpg";
　　　　com="コメント２";
　　}
　　else{
　　　　imgsrc="画像３.jpg";
　　　　com="コメント３";
　　}
　　W = window.open("", "");
　　
　　window.W.document.write("<html><body><div>"+com+"</div><br><div><img src='"+imgsrc+"'></div></body></html>");
}
-->
</script>
</head>
<body>
<img src="バナーへのパス.gif" alt="バナー" onClick="sample()">
</body>
</html>

＞ANo.1さんのものを単純化して、すこし修正しました。
こういう感じだと汎用が高いかと。
    • good
    • 0
    • 件
通報する
この回答へのお礼

いろんな方法もあるんですね。まだよくわかってないので、ずっと頭を悩ませていたのが嘘みたいです。
参考にさせていただきました。
ありがとうございました。

通報する
お礼日時：2005/06/22 20:51

No.2

ランダムな動作には乱数を用います。


処理は JavaScript で。

lvnRet=window.top.Math.floor(lvnHigh*window.top.Math.random()+lvnLow);
上記により、lvnLow 以上 lvnHigh 未満の整数値の乱数が lvnRet に得られます。

lvnRet=window.top.Math.floor((lvnHigh+1)*window.top.Math.random()+lvnLow);
上記の場合は lvnHigh 未満を以下とする事ができます。

後は、if文による判断にて処理をＡ用, Ｂ用, Ｃ用, と分けるも良し
配列を用いて得た値を添え字とするも良し・・・。
ただし配列の場合、ブラウザ等閲覧者の環境により
少々振る舞いが異なったりするので注意が必要。
仮に今回の様にデータが３件として
添え字０が１件目を指す場合と件数情報を保持する場合とが・・・。
（ＣＧＩの様に環境が固定ならいいのですが、今回の提示は JavaScript というどの様な環境で動くか閲覧者次第という重要なポイントが。）

という事でデータ件数及び内容が固定で且つ少ない今回の様な場合は、if文による処理分岐をお勧めします。

本当の処の理想は、乱数を求める汎用的な関数，配列を作る汎用的な関数，配列を扱う為の汎用的な関数・・・
と、いろいろ関数を用意して処理するのが良いのですが・・・、結構大変です。
    • good
    • 0
    • 件
通報する
この回答へのお礼

当方、Javascriptに取り組み始めたばかりで、正直、koutarou504様のおっしゃる内容も、わかったようなわからないような・・・。
関数に関しては理解力がその域にまで達していませんが、頑張りたいと思います。
ありがとうございました。

通報する
お礼日時：2005/06/22 20:40

No.1

  • 回答者： EUR
  • 回答日時：

配列に説明文と画像の順番が対応するように説明文と画像を登録し、ランダム関数を用いてアクセスする番号を決定します。



以下に例を載せます。

<HTML>
<head>
<script language="javascript">
<!--
var W;
function sample() {
　　var Comments = new Array("コメント１", "コメント２", "コメント３");
　　var Images = new Array("画像１.jpg", "画像２.gif", "画像３.tif");
　　
　　do {
　　　　//ランダムで0～2の数字を算出する
　　　　//Math.floor：小数点以下切捨て
　　　　//Math.random：0～1の範囲でランダム数を生成
　　　　random_num = Math.floor(Math.random() * Comments.length);
　　　　if (random_num != 3) {
　　　　　　//算出結果が0～2の範囲だったら、ループを抜ける。3の場合だけループする。
　　　　　　break;
　　　　}
　　} while (1);
　　
　　W = window.open("", "");
　　
　　window.W.document.write("<html><body><div>" + Comments[random_num] + "</div><div><img src='" + Images[random_num] + "'></div></body></html>");
}
-->
</script>
</head>
<body>
<img src="バナーへのパス.gif" alt="バナー" onClick="sample()">
</body>
</HTML>

コメント、画像へのパス、バナーへのパスは適当なものに置き換えてください。
    • good
    • 0
    • 件
通報する
この回答へのお礼

すぐに回答いただき、ありがとうございました。
初心者でよくわからなかったので、（do { 以下）コピーしてそのまま使わせていただいてよろしいでしょうか？

通報する
お礼日時：2005/06/22 20:33

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報