我必須阻止頁面的其餘部分從滾動鼠標時的引導酥料餅的滾動條

Question

我有這樣的引導酥料餅，使用戶能夠把在線評論在我的網站裏： http://i.imgur.com/8QFFQcf.png

有一個滾動條上右上方。如果用戶在框中向下滾動並擊中底部，則後面的頁面將開始滾動。當這個彈出窗口處於焦點/滾動狀態時，有什麼辦法可以阻止用戶滾動主頁面嗎？

在我的情況下接受的解決方案：

  $('.my-class').on('shown.bs.popover', function() { 
       $('.popover-title').hover(function(e) { //popover title is 
       //the scroll window in the popover 

        $('body').addClass('no-scroll'); 
       }, function() { 
        $('body').removeClass('no-scroll'); 
       }); 
      }); 

這裏的CSS：

.no-scroll { 
    overflow: hidden; 
    margin-right: 15px; 
    //hides scrollbar without moving the body over 
} 

謝謝！

Answer 1

如果你定身的CSS屬性overflow到hidden應該從能夠滾動體停止用戶。

function disableScroll() { 
    document.body.style.overflow = "hidden"; 
} 
function enableScroll() { 
    document.body.style.overflow = ""; 
} 

Answer 2

//prevents keyboard scroll 
function noScrollEvt (e){ 
    if (e.keyCode === 40 || e.keyCode === 38) { 
     e.preventDefault(); 
     return false; 
    } 
}; 
//use this function to disable scroll 
function disable() { 
    $('selector') 
    .on('keydown', noScrollEvt) 
    .css('overflow', 'hidden'); 
} 
//use this function to enable scroll 
function enable() { 
    $('selector') 
    .off('keydown', noScrollEvt) 
    .css('overflow', ''); 
}