• 締切済み

プルダウンバーに近い感じのものですが・・・

ホームページ作成に関しての質問です。つくりたいと思っているのは、一つのページの中に、ボタンのようなもの(商品Aといったような文字が書いてあるイメージ)が10個ぐらいバラバラにあって、その一つを押すとそのボタンの下に説明文が出てくるというような感じです。プルダウンボックスでは、選択肢としての表示しかできず、単なる情報としてバーが出てくるイメージに合いません。javaを使ってみましたが、pulldown()で呼び出すことはできるのですが(この場合は選択肢にならないで済む=情報のみのバーができる)、ボタンのうちの一つにしか適用できません。(←すいません。javaはほとんど分かりません・・・それぞれIDか何かつけてあげたらいいのかもしれませんが、その方法も分かりません・・・)。各ボタンどれを押してもそれぞれのボタンの下にそのボタンに関する情報が表示される、そのようなことはできないでしょうか? あと、欲を言えば、トップページにボタン(ここではリストになってます)の一覧があって、そのボタンを押すと上記のページが開き、そのボタンに関する情報が表示された状態でそのページが開くというものにしたいのです。 可能なのかさえ分からないのですが、どなたかこの難題に答えてくださる方はおられませんでしょうか・・・?

みんなの回答

  • noris02
  • ベストアンサー率74% (56/75)
回答No.1

以下の想定で書いてみます。 ・javascriptである( javaとjavascriptが別物) ・どこかのサンプルを引っ張ってこられた( pulldown()という関数がわからなかった) ・トップページに <select><option>があって そこから <a>で、今のページに飛ばしたい こんなかんじかな。 hoge.html?1 もしくは hoge.html?2 で リンクされます。 <html> <head> <script language="JavaScript"> window.onload=function(){ ret = location.search.substr(1); if(ret!="")pullDown("box"+ret); } function pullDown(key) { if(document.getElementById(key).style.display=="block"){ document.getElementById(key).style.display = "none";} else{ document.getElementById(key).style.display = "block";} } </script> </head> <body> <div onclick='pullDown("box1")' style="position:relative;">表示する<BR> <div id="box1" style="display:none;position:absolute;top:15px; background:#fcc;border:1px solid #ccc;"> BOX1の説明です<br><br> </div> </div> <br><br><br> <div onclick='pullDown("box2")' style="position:relative;">表示する2<BR> <div id="box2" style="display:none;position:absolute;top:15px; background:#fcc;border:1px solid #ccc;"> BOX2の説明です<br><br> </DIV> </div> </body> </html> jqueryでもできると思います。