我正在使用一些代碼來禁用滾動并在全屏選單處于活動狀態時保留滾動條,但是當通過單擊漢堡圖示打開選單時,頁面會跳轉到頂部。知道如何阻止這種情況發生嗎?
.noscroll {
position: fixed;
overflow-y:scroll;
}
jQuery(document).ready(function($){
$('.btn-open-menu').click(function () {
$('html, body').addClass('noscroll');
})
$(document).on('click','.btn-close-menu', function(event){
$('html, body').removeClass('noscroll');( {}, event);
})
});```
uj5u.com熱心網友回復:
我會嘗試類似的東西:
我正在使用一些代碼來禁用滾動并在全屏選單處于活動狀態時保留滾動條,但是當通過單擊漢堡圖示打開選單時,頁面會跳轉到頂部。知道如何阻止這種情況發生嗎?
.noscroll {
position: fixed;
overflow-y:scroll;
}
jQuery(document).ready(function($){
$('.btn-open-menu').click(function () {
let scrollPosition = $(document).scrollTop();
$('html, body').addClass('noscroll');
$('html, body').css('top', '-' scrollPosition 'px');
$('html, body').attr('data-scroll', scrollPosition);
})
$(document).on('click','.btn-close-menu', function(event){
$('html, body').removeClass('noscroll');( {}, event);
$(document).scrollTop( $('html, body').attr('data-scroll') )
})
});
這將使正文固定,但會將其位置設定為當前滾動位置而不是頁面頂部。
編輯:嘗試將滾動位置保存到元素屬性,以便您可以在關閉選單時訪問它并相應地設定檔案滾動位置
uj5u.com熱心網友回復:
我認為問題出在您的 css 上,我在某些網站上使用了類似的系統,而我使用的 css 只是:
.noscroll {
overflow: hidden;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/485389.html
標籤:javascript html jQuery css
上一篇:使用選擇器從陣列更改時多選
