0

（Jqueryを使用して）ページのウィンドウをポップアップする方法を知っています。私がやりたいのは、ページのポップアップウィンドウを制限して、下にスクロールしても上がらないようにすることです。「親ページ」は非常に長い場合がありますが、ポップアップが表示されたら、ページを「サイズ変更」して、ページを下にスクロールできないようにします。ポップアップは、おそらくページの中央にとどまります。

わかりました、私は十分に明確ではなかったことを知っています。いくつかの例を見てみましょう。

1）Coursera。Courseraからコースを受講したことがある場合（絶対に必要です）、ビデオを見ると、ビデオがポップアップ表示されます。ただし、下にスクロールすると、ビデオが上に移動し、視界から外れることさえあります。これは私が望むものではありません。

2）ピンタレスト。画像をクリックすると、新しいウィンドウがポップアップ表示され、スクロールバーのステータスが変更されていることがわかります。ポップアップが表示される前のものではなくなりました。

現在、私のポップアップには次のような絶対位置スタイルがあります。

.popup{
position: absolute;
top: 40px;
...
}

では、目標を達成できるように、ポップアップをどのようにスタイル設定する必要がありますか？よくわからないことがあれば、聞いてください。

編集：これらの2つの答えのようにポップアップを修正するのは素晴らしいことですが、最初のページの代わりにポップアップに従ってスクロールする方法はありますか？つまり、コンテンツ全体を表示するためにポップアップをスクロールする必要がある場合はスクロールできますが、ポップアップが既にそのままの場合は、最初のページの高さに関係なく、まったくスクロールできません。

では、以下の回答の例でポップアップがポップアップしたときにスクロールバーを非表示にする方法はありますか？

4

2 に答える 2

1

これですか？

.popup {
    position: fixed;
    top: 50%;
}

http://jsfiddle.net/VE76x/1/

まあ、それはまだスクロールしますが、ポップアップは固定されたままです。

于 2013-01-25T16:19:37.147 に答える
1

Antony's answer に基づくクロスブラウザ ソリューションを次に示します。IE は、固定ではなく絶対位置を使用します。

.popup {
    position: fixed;
    top: 50%;
}
<!--[if IE]>
    .popup {
        position: absolute;
        top: 50%;
    }
<![endif]-->

http://jsfiddle.net/BerkerYuceer/VE76x/2/

于 2013-01-25T16:39:38.310 に答える