3

すべてのページに「ログイン/登録」リンクがあるサイトを構築しています。誰かがこのリンクをクリックするたびに、JavaScript / divベースのサインアップフォームをコンテンツの上に浮かせて、必要に応じて「閉じる」ためのリンクを付けたいと思います。

また、マウスの位置の近くにdivの機能が表示されるようにしたいので、ページの中央近くにあるリンクをクリックすると、中央近くに表示されるはずです。スクロールする必要はありません。それを見るためにトップ。（明確にするために、マウスの座標を自動的に決定するか、（x、y）座標を指定する方法が必要な場合があります。）

私自身はJavaScriptの優れた開発者ですが、専門家ではないので、これをうまくやっているライブラリがいくつかあると確信しています。共有するリンク/チュートリアルはありますか？

4

5 に答える 5

3

今日、はるかに優れたアプローチがあります。これは jQuery ダイアログと呼ばれます: http://jqueryui.com/demos/dialog/

モデル フォームのサンプルを見てみましょう: http://jqueryui.com/demos/dialog/#modal-form

于 2012-05-04T16:14:08.217 に答える
2

jQueryThickboxを見てください。

http://jquery.com/demo/thickbox/

于 2008-12-06T06:00:07.390 に答える
1

あなたはこれを試すことができます：

<div id="loginBox"><!-- insert content here--></div><br />
<style type="text/css"><br />
   #loginBox { <br/>
        display:none; <br/>
        position:absolute; <br/>
        /* left and top */<br/>
   }<br/>
</style><br/>
<script type="text/javascript"><br/>
   function showLoginBox() { document.getElementById('loginBox').style.display = 'block'; }<br/>
</script><br/>
<a href="#" onclick="showLoginBox()" >Show login box</a><br />

単純な解決策が必要な場合は、これでうまくいくはずです。

于 2008-12-06T10:50:29.767 に答える
0

Thickbox を試してみましたが、表示したい div のコンテンツではなく、常に空のボックスが表示されました。それで私はIboxを見つけました、そしてそれはうまくいきました:)

于 2008-12-07T18:32:01.457 に答える
-2

ツールバーやアドレスバーなどを非表示にして、新しいウィンドウにログインページを表示することもできます。メインページのマウスクリックイベントから取得したマウス座標を使用して、ウィンドウの位置を設定できます。

于 2008-12-06T10:18:09.973 に答える