こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

ポップアップ・ウィンドウについて

リンクをクリックすると、別画面でサイズ指定された画面が表示される仕組み(ポップアップ・ウィンドウ?)を作りたいと思っています。商品の説明ボタンを押すとその商品の詳細な説明が表示される、というイメージです。

そこで、
http://www.akikobrand.com/html/02_0219sample/2.windowopen/index.html#
のサイトにあるソースを参考にして作ってみたのですが、この方法ですと、ポップアップが表示された時点でリンク元のページが勝手にページトップまで戻ってしまいます。この方法は、とてもシンプルで私でもすぐに使えたのですが、リンク元のページはかなり長い(ユーザーさんにはスクロールダウンして見てもらうつもりです)のでページのトップまで戻ってしまうと不都合があります。

なんとか、リンク元の表示はそのままにして簡単にポップアップを出す方法はないでしょうか?

私のページでは、リンク元のページから8個のリンクボタンを設置してそれぞれ別の商品説明画面(ポップアップ)を出したいと思っています。

どなたかご存知の方がいらっしゃいましたらどうぞよろしくお願いいたします。

投稿日時 - 2004-11-18 16:06:13

QNo.1089922

困ってます

質問者が選んだベストアンサー

アンカーのURI指定に、“javascript:void(0);”を設定してください。

<a href="javascript:void(0);" onClick="...">詳細表示</a>

“#”を指定すると、現在のページを読み直すブラウザがあります。

<input type="button" onClick="..." value="詳細表示">

なら、そう言う心配が要らないけど・・・

投稿日時 - 2004-11-18 19:58:18

お礼

ご回答ありがとうございました。私が求めていたのはこれでした。#のかわりに"javascript:void(0);"を入れたら思った通りにリンク元の画面は動かずにポップアップが開くようになりました。助かりました。ありがとうございました。

投稿日時 - 2004-11-19 03:53:54

ANo.3

このQ&Aは役に立ちましたか?

1人が「このQ&Aが役に立った」と投票しています

回答(3)

ANo.2

こんばんは。

<a href="#" onclick="・・・

<a href="#1" onclick="・・・
にしてしまうのはダメですか?
1とか2には、別に意味はありません・・・。
(^^ゞ

投稿日時 - 2004-11-18 17:46:39

お礼

ご回答ありがとうございました。早速試してみましたが、#のあとに1とか2をつけてみても、やっぱりリンク元の画面はページトップに戻ってしまいました。。。でもでも、ご回答いただけたのはとても嬉しかったです。ありがとうございました。

投稿日時 - 2004-11-19 03:50:02

ANo.1

参考URLのページを例にとると・・

<a href="#" onclick="window.open('1.html','win1','width=350,height=400');"><img src="img/1.gif" width="130" height="19" border="0"></a>



<a href="1.html" target="_blank"><img src="img/1.gif" width="130" height="19" border="0"></a>

とすれば、新しいウィンドウが開くだけです。
ただ、<a>タグのスタイルをtext-decoration:noneにしておいた方がいいかもしれません。

投稿日時 - 2004-11-18 17:37:31

お礼

早速ありがとうございました。この方法ですと、新しく開くウィンドウのサイズは指定できないのではないでしょうか。一番に回答をいただけて嬉しかったです。どうもありがとうございました。

投稿日時 - 2004-11-19 03:43:32

あなたにオススメの質問