サイトを開くと自動的にポップアップのウィンドウを開く方法は、最近はポップアップブロッカーがあるため、代替の方法を探しています。

CSSをつかって画面上にレイヤーを重ねて子ウィンドウのように見せるやり方もあるようですが詳しい作り方がわかりません。教えていただけますか。もしくはほかにポップアップの代案になるようなやり方を教えてください。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2005/09/01 15:23:11
  • 終了:--

回答(6件)

id:typista No.1

typista回答回数359ベストアンサー獲得回数72005/09/01 19:58:17

ポイント17pt

http://www.hajimeteno.ne.jp/dhtml/dist/js13.html

JavaScript,ダイナミックHTMLサンプル-マウスでドラッグ&ドロップ

ie6でのみ動作確認済みですが、以下のように記述すれば、ごくごく簡単なポップアップは擬似れます。

もしドラッグ&ドロップによる移動まで実現したいようでしたら、URLを参考にしてみてください。

---

<html>

<script language=”JavaScript”>

function openSubWin() {

var p = document.getElementById(’popup’);

p.style.visibility=”visible”;

}


function closeSubWin() {

var p = document.getElementById(’popup’);

p.style.visibility=”hidden”;

}

</script>


<body onLoad=”openSubWin()”>


<div id=”popup” style=”visibility:hidden; position: absolute; left: 100px; top: 100px;”>

<table border=”1” cellspacing=”0” cellpadding=”0” width=”200”>

<tr>

<td bgcolor=”blue” align=”right”>

<input type=”button” onClick=”closeSubWin()” value=”X” />

</td>

</tr>

<tr>

<td>

擬似ポップアップウィンドウのレイヤ

</td>

</tr>

</table>

<div>

</body>

</html>

id:two_three

ありがとうございます。

2005/09/01 20:16:19
id:aria_corp No.2

aria_corp回答回数38ベストアンサー獲得回数02005/09/01 21:36:09

ポイント17pt

http://www.tcp-ip.or.jp/~mt2knm/etc/obs_metasrch_lib.html

オンライン書店メタ検索JavaScript集

JavaScriptでHTMLとCSSをつかって、ポップアップメニューっぽく見せかける例

id:two_three

ポップアップメニューでなくて

ポップアップウィンドウがやりたいのです。

2005/09/01 22:34:52
id:matun55 No.3

matun55回答回数73ベストアンサー獲得回数02005/09/01 22:45:50

ポイント17pt

<html>

<head>

<script language=”JavaScript”><!--

function subwindow(){

W_width = ”400”; // ウインドウの幅

W_height = ”300”; // ウインドウの高さ

W_right =”15”; // ウインドウを開く右からの位置

W_top =”10”; // ウインドウを開く上からの位置


W_left = screen.width - W_width - W_right;


window.open(”xxx.html”,”subwindow”,’width=’+W_width+’,height=’+W_height+’,left=’+W_left+’,top=’+W_top+’,screenX=’+W_left+’,screenY=’+W_top);

}

//--></script>

</head>

<body>

<a href=”JavaScript:subwindow()”>サブウィンドウOPEN</a>

</body>

</html>


コピペしましたが、ボタンで開くやり方です。

id:two_three

ユーザーアクションで開くのではなく、

そのURLを訪れたら自動的にポップアップウィンドウを開くやり方、もしくは同様の効果を探してますのでちょっと違いますね。

2005/09/02 10:07:59
id:nabecchi No.4

nabecchi回答回数32ベストアンサー獲得回数02005/09/02 16:14:47

ポイント17pt

ホバーウィンドウというのはいかがでしょうか。

無料で設置する方法が出回っています。

ただ、これ、SEO的にはあまりよろしくないとのことで、

最近はフロートインウィンドウというのが出てきてますが、

こちらは有料情報しか見つけられませんでした。

http://infostore.jp/dp.do?af=nb0508&ip=slowtrain&pd=0002

該当の商品は販売対象外です。

id:two_three

おおーー!!

こういうのを探してました!!

ありがとうございます。

ほかにもありましたら教えて下さい。

2005/09/02 23:43:39
id:i_sawada No.5

i_sawada回答回数28ベストアンサー獲得回数12005/09/03 20:16:44

ポイント16pt

http://www.dynamicdrive.com/dynamicindex11/abox2.htm

Dynamic Drive DHTML Scripts- Popup Box II

これなんか、いかがでしょうか。


見た目や動作の設定もカスタマイズできるので、ポップアップウィンドウの代替としてはぴったりな気がしますが・・・。


Windows、Mac共に主要ブラウザには対応していますし、非対応のブラウザ(IE 4.xなど)では自動的にポップアップウィンドウとして開くこともできます(設定変更可)

id:two_three

ありがとうございます。

2005/09/04 23:11:45
id:ibushigin No.6

ibushigin回答回数13ベストアンサー獲得回数12005/09/04 21:30:58

ポイント16pt

http://www.dynamicdrive.com/dynamicindex17/dropinbox.htm

Dynamic Drive DHTML Scripts- Drop-in content box

英語サイトですが、コードを自動生成してくれますのでわかりやすいかと思います。


JavaScriptを外部ファイル化してしまえば、HTMLのヘッダもあまり汚れませんね。SEO的にはどうなのか、詳しいことはわかりませんが。。

id:two_three

いろいろあるんですね。

2005/09/04 23:12:50

コメントはまだありません

この質問への反応(ブックマークコメント)

トラックバック

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません