我的頁面頂部有一個全屏預告片。當用戶開始滾動時,我希望整個頁面自動平滑地向下滾動到以下部分。不幸的是,以下代碼不起作用。如前所述,它根本不會滾動,并且當我不將scrolling變量設置為true以避免多次執行scrollIntoView時,它非常慢。使用香草JS修復此問題的好方法是什么?示例,在Chrome中進行了測試:let scrolling = false;window.onscroll = () => { const offset = window.pageYOffset; if (offset > 0 && offset < window.innerWidth && !scrolling) { scrolling = true; document.querySelector('.somecontent').scrollIntoView({behavior:'smooth'}); } if (offset >= window.innerWidth) { scrolling = false; }}.someteaser { background: blue; height: 100vh; width: 100vw;}.somecontent { background: red; height: 200vh; width: 100vw;}<div class="someteaser"></div><div class="somecontent"></div>因此,問題在于行為:“平滑”選項。沒有它,滾動將起作用,但是當然不再平滑了。這似乎是scorllIntoView上的錯誤,我不太了解。我的臨時解決方案使用此腳本,該腳本可以正常運行:https : //github.com/cferdinandi/smooth-scroll
滾動位置> 0后如何平滑向下滾動到元素?
DIEA
2021-05-21 19:18:29