3

ページ上の読者の位置に対して中央に配置したいモーダルウィンドウがポップアップしています。これを達成する最善の方法は、位置固定/上位 50% 固定を使用することです。

.fixed {
    position:fixed;
    width:100px;
    height:100px;
    top:50%;
    left:50%;
    margin-left:-50px;
    margin-top:-50px;
}

これまでのところ、モーダルは正確な中央にポップアップします。ここで jsfiddle を参照してください: http://jsfiddle.net/cbqN2/

しかし、コンテンツが画面に対して長すぎる場合、ユーザーがモーダルをスクロールできるようにしたい: http://jsfiddle.net/xwhMa/1

これを達成する方法はありますか?異なる位置で div をネストするか、最後の手段として JQuery を使用しますか?

4

3 に答える 3

4

これがあなたの求めているものかどうかはよくわかりませんが、これを試してください：

ul li {font-size:23px}
.fixed {
    width:200px;
    height:200px;
    background:red;
    position:fixed;
    top:50%;
    left:50%;
    margin-top:-100px;
    margin-left:-100px;
    **overflow-y:scroll**
}
于 2012-08-02T17:31:08.907 に答える
1

これはうまくいきませんか？

http://jsfiddle.net/demchak_alex/cbqN2/3/

モーダルに、コンテンツを保持し、固定の高さでクリップするコンテナーを持たせますか? 次に、ユーザーは、jQueryソリューションがモーダルの外側をスクロールして下部に到達するまでスクロールし、下部に固執するなどの心配をする代わりに、モーダルでスクロールできます。

于 2012-08-02T17:29:04.530 に答える
0

それは :) の特異性にすぎませposition: fixedん..まあ、常に画面に固定されたままです。中央に表示したいが、ユーザーがページをスクロールしたときに移動したい場合は、単にposition: absolute;notを使用しますfixed。そのように：http://jsfiddle.net/skip405/cbqN2/2/

于 2012-08-02T17:29:37.753 に答える