- ベストアンサー
テーブルで画像+文字+リンクをランダム表示させる
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q10117086670 この人？ 今回の質問にDWやXAMPPが何も関係ないってことすら分からんレベルの癖に贅沢言わないでくれないかな… 初心者ですって言えば何でも許されると思ったら大間違いですよ。 ・「ランダムに1つ」ならできて「重複なしで3つ」ができないのか ・「1つ」ならできて「3つ」ができないのか ・そもそもランダムができないのか ・「何を」調べて「何が」分からなかったのか どこまでできて何ができないのかをはっきり言わないと、結局一から十まで教えることになり、宿題を丸投げしてくる小中学生と同レベルです。 何も分からなくて他人に頼るなら、せめてそれくらいは自分で努力してくださいね。 ご希望のプログラムを組むには「配列」「乱数」「HTMLへの出力」などの知識が必要ですが、どれもまったく知らないんでしょ？ 初心者が高望みなどせず、順番に覚えなさい。 まずは「配列」について理解しましょう。 次に「乱数」について理解しましょう。 そうすると「配列の中のどれかをランダムにひとつ取得」ができるようになります。 次に、HTMLへの出力を覚えます。 出力するためには、出力する「もの」を作成することと、出力先を取得することが必要になります。 まずは空の<body>内に文字を出力することから始めましょう。 慣れてくれば、特定の場所（今回で言えば特定のテーブルセル内）に特定の要素を入れることができるようになります。 これを組み合わせると「配列の中からランダムに3つを特定の場所に出力」ができます。 これくらいのレベルに来てやっと「重複なく3つ」に手を出せます。 JavaScriptには標準で「配列のある要素を取得し、それは配列から削除する」という機能がありますので、インデックスに乱数を与えてこれを3回行えば「重複なくランダムに3つ」が実現できます。 どうですか？ 「何も分かりません全部教えてください」って言ったからって簡単に教えられるような内容じゃない（あなたレベルの人にとって）ことが分かりましたか？ 悪いことは言わないからできることからやりましょう。 ※下記が動作としてはあなたの希望通りであることを確認してください。 <html> <head> <script> window.onload = function(){ var list = new Array( '<img src="画像1.jpg" alt="sample1" width="170" height="200">\n<p><a href="画像1.html">説明1</a></p>\n<p>詳細1</p>', '<img src="画像2.jpg" alt="sample2" width="170" height="200">\n<p><a href="画像2.html">説明2</a></p>\n<p>詳細2</p>', '<img src="画像3.jpg" alt="sample3" width="170" height="200">\n<p><a href="画像3.html">説明3</a></p>\n<p>詳細3</p>', '<img src="画像4.jpg" alt="sample4" width="170" height="200">\n<p><a href="画像4.html">説明4</a></p>\n<p>詳細4</p>', '<img src="画像5.jpg" alt="sample5" width="170" height="200">\n<p><a href="画像5.html">説明5</a></p>\n<p>詳細5</p>', '<img src="画像6.jpg" alt="sample6" width="170" height="200">\n<p><a href="画像6.html">説明6</a></p>\n<p>詳細6</p>', '<img src="画像7.jpg" alt="sample7" width="170" height="200">\n<p><a href="画像7.html">説明7</a></p>\n<p>詳細7</p>', '<img src="画像8.jpg" alt="sample8" width="170" height="200">\n<p><a href="画像8.html">説明8</a></p>\n<p>詳細8</p>', '<img src="画像9.jpg" alt="sample9" width="170" height="200">\n<p><a href="画像9.html">説明9</a></p>\n<p>詳細9</p>' ); for(i=1;i<=3;i++){ document.getElementById("td" + i).innerHTML = list.splice(Math.floor(Math.random() * (list.length-1)),1); } } </script> <title>test</title> </head> <body> <table border="1"> <tr><td width="265" id="td1"></td><td width="265" id="td2"></td><td width="265" id="td3"></td></tr> </table> </body> </html>
関連するQ&A
- 画像＋リンク＆文字のランダム表示について
画像＋リンク＋文字のランダム表示について 復数ある画像、リンク、文字のなかからランダムで数個（かぶらないように）表示させたいのです。 それもテーブルタグの中に。 （画像Ａには必ずリンクＡと文字Ａがせっとになるようにです） 初心者なのでどのようにしたら良いのか、またこんな事ができるのかどうかもわかりませんが・・・ おわかりになる方、詳しく教えてください。 一応ＨＴＭＬでＨＰをつくっているので、このように書いたら良いよ・・・という見本のようなモノを作って頂けると幸いです。 宜しくお願いします ↓の画像のように３パターンの表示を考えています。 解りづらいかもしれませんが、よろしくお願いします。
- ベストアンサー
- HTML
- 画像とテキストをランダム表示、さらに両方へリンクをかけたい
http://okwave.jp/qa1606923.html 上記のページで画像とテキストのセットをランダムで表示させる回答をいただいた質問ページがあったのですが、テキスト部分にも画像と同様にリンクをかけたいのです。 その場合はどのようにすれば良いでしょうか？ 宜しくお願いします＞＜
- ベストアンサー
- JavaScript
- ランダムに文字を表示したい
ランダムにテキストやリンクを表示するプログラムを書きたいのですが、何かいいサイトかいい方法はないでしょうか？ ランダムに表示する文字列は違うTXTファイルなどに保存して別で管理する方法にしたいのですが。 CGI初心者なのですがよろしくおねがいします。
- ベストアンサー
- CGI
- １つのテーブルに任意の文字を表示させたい
１行１列のテーブル（テキストボックスみたいなもの）を作っておきます。 テーブルの横もしくは下にリンクを張った？文字又は画像にマウスが乗ると用意してある任意の文字がテーブルに表示させる事は出来るのでしょうか？多分ＪＡＶＡスクリプトで実現するものだと思うのですが・・・？ イメージとしてはリンクさせる文字の上にカーソルが乗るとリンク先の簡単な説明が表示され、クリックで目的ページに飛ぶというようなものです。リンクによって表示される内容が違いますが、表示されるテーブルは同じものを使いたいのです。 質問の内容も判りずらく、失礼な質問ですがよろしくお願いします。
- ベストアンサー
- JavaScript
- 数ある中からランダムで抽出しての表示
画像を貼ったので見て頂きたいのですが、javascriptでランダムに表示されるリンクを作りたいのですが、全くわからないため、サンプルのようなものを作って頂きたいのです。 四角いものが画像で、……で表示されてるのを文章にしたいのです。 色が同じものをセットで表示したいのですが、数個の中からランダムで表示したいのです。 例えば、画像１０種類と文章が１０種類あるとしたら、赤の画像と赤用の文章をセットで一つとし、縦３つのものと、横に３つのものを作りたいのです。 表示する数は、３つより増えるかもしれませんが・・・ しかも、１０種類の中から、かぶることなく３つを表示させたいのです。 それと、縦表示の画像の無い、文字リンクのものも作りたいのです。 貼った画像には黒い枠がありますが、実際にはいりません。 凄くわがままなお願いですが、よろしくお願いします。
- ベストアンサー
- JavaScript
- テーブル内の文字をテキストファイルへリンク
サークルのホームページを作成しています。 トップページに最新ニュース(更新履歴のようなもの)を載せたいのですが、 自分以外の、HTMLの知識がない者でもこの部分だけ更新できないものかと悩んでおります。 たとえば、最新ニュースの枠内だけテキストデータをリンクさせ、 更新の際はサーバーにテキストデータをアップするのみにするなど、 何か方法がありましたらご教授下さい。 上記の方法も、具体的な作成の仕方がわかりませんので、 教えて頂けると幸いです。 MacBook, OSX, Dreamweaverを使用しています。 よろしくお願い致します。
- 締切済み
- HTML
- ポスターを作り、その中の文字からリンクをはるには？
質問:No.7917810のところで、言葉足らずで、申し訳ありませんでした。WORDを使い、ポスターを作成します。それをDREAMWEAVERに移植して、文字の部分をクリックすると詳しい内容のところにリンクをはるためのHTML言語を教えてください。WORDで作成したポスターがうまく移植できるかどうかもまだわかっていません。HTML言語で作り直さないといけないのではないかと考えています。これも可能でしょうか。文字をクリックして、リンク先に飛び、さらにそのリンク先から次のリンク先に飛ぶことはできるのでしょうか。 WORDとHTML言語とは異なるものなので、移植がうまくいかないような気もします。WORDで作ったポスターをHTML言語を使って、再現することは可能でしょうか。アドバイスいただけるとありがたいです。会社のホームページ用のソフトがDREAMWEAVERになっており、業者に頼むと代金が発生するため、やってくれと言われました。このようなことは初めてなので、教えていただけるとありがたいです。
- ベストアンサー
- ホームページ作成ソフト
- 別々のテーブルは横に並べられない？
Dreamweaverを使ってホームページを作っています。 初歩的な質問なのですが、 別々のテーブルを横に並べて表示したいのですが、 できないことなのでしょうか？ また、テーブルの横にテキストを入力することも 不可能なのですか？ ひとつのテーブルで作ったりすると、表示が遅めに なってしまわないでしょうか．．．？ ご存知の方どうかお教えください。 よろしくお願いします。
- ベストアンサー
- CSS
- テーブルの背景画像にリンクを設定したい
ナビゲーションボタンを配置するのに、テーブルで、 tdの背景画像として同じ画像を設定しました。 メニューはテキストで記述しました。 そのテキスト部分ではなく、背景画像にリンクを 設定したいのですが、できますでしょうか。 テキストは左寄せで短いものもあるので、 テキストリンでは、ボタンの右の方をクリックしても リンクせず、使い勝手が悪いかと思いまして・・。 文字も込みの画像でボタンを作るとどうも鮮明でない ような気がしたので、このようなやり方にしようかな と考えたのですが、何かいいアドバイスありましたら よろしくお願いします。
- ベストアンサー
- HTML
- Dreamweaverのレイヤー・テーブル・フレームについて
Dreamweaverではレイヤー・テーブル・フレームなど、レイアウトを設定できる方法がありますが、以下のどれでもよいので回答お願いします。 質問０ Dreamweaverでは「レイヤーからテーブルへ変換」することができますが、レイヤーがかさなっていると変換できないようなのですが、どうにか良い方法はないでしょうか？できたら重ねて作りたいのですが… 質問１ Dreamweaverでは「レイヤーからテーブルへ変換」することができますが、HTMLファイル自体はレイヤーとテーブルのどちらが軽いファイルになるのでしょうか？また、レイヤーを利用した場合、表示が構築状態とは違う状態になりますが、どうしたらよいのでしょうか？ 質問２ 入力フォームを作ろうと思うのですが、これは、データテーブルで構築するべきでしょうか？自分はフォームの下に画像（綺麗なテーブル）をのせようと思うのですが、無難と言えない構築方法なのでしょうか？
- ベストアンサー
- ホームページ作成ソフト
お礼
何度も何度もすいませんでした。 無事作ることができました。 ありがとうございます。