2

Twitter Bootstrapのモーダルウィンドウを使用していますが、スクロールすると、背景ページが移動している間、モーダルポップアップが固定されたままであることに気付きました。デモの場合は、次のページの[デモモーダルの起動]ボタンをクリックできます。

http://getbootstrap.com/2.3.2/javascript.html#modals

それを回避し、代わりにスクロールイベントでモーダルウィンドウを制御するにはどうすればよいですか？Bootstrapが提供するオプションにはそれが含まれていないようです。

モーダルポップアップは<div>withposition: fixedであり、スクロールしても固定されたままになるのはそのためです。ただし、ポップアップしたままにする必要があるため、他の値に設定することはできません。また、<body>のスタイルをに設定するoverflow:hiddenと、スクロールバーが非表示になることもわかりました。しかし、それは私が望んでいることではありません。

4

3 に答える 3

2 
$('.modal') 
.on('shown', function(){ 
console.log('show'); 
$('body').css({overflow: 'hidden'}); 
}) 
.on('hidden', function(){ 
$('body').css({overflow: ''}); 
});
于 2013-12-27T11:19:22.187 に答える
1

この回答に従って追加できoverflow: hiddenますbody.modal-open

于 2013-01-27T22:48:54.893 に答える
0

でシフトを解決します

body{
    position: fixed;
    left: 0px;
    right: 0px;
    /*margin: auto;*/
}
于 2014-04-08T15:37:55.787 に答える