如何使javascript scrollIntoView流暢？

在一個反應應用程序中，我有一個方法被調用來將一個特定的節點放入視圖中，如下所示。如何使javascript scrollIntoView流暢？

scrollToQuestionNode(id) { 
     const element = document.getElementById(id); 
     element.scrollIntoView(false); 
}

滾動發生得很好，但滾動操作有點生澀。我怎樣才能讓它順利？我沒有看到任何我可以給scrollIntoView的選項。

來源

2017-02-28 Sahil Sharma

它現在是Chrome支持（在Chrome 61） –

這可能有幫助。

從mdn文檔的scrollIntoView 您可以傳入選項而不是布爾值。

scrollIntoViewOptions Optional 
A Boolean or an object with the following options: 
{ 
    behavior: "auto" | "instant" | "smooth", 
    block: "start" | "end", 
}

所以你可以簡單地傳遞這樣的參數。

scrollToQuestionNode(id) { 
     const element = document.getElementById(id); 
     element.scrollIntoView({block: 'end', behaviour: 'smooth'}); 
}

參考：https://developer.mozilla.org/en/docs/Web/API/Element/scrollIntoView

來源

2017-02-28 08:46:24 lavish

由於出手闊綽，但我已經嘗試過了。正如你可以在你提到的鏈接中看到的，chrome不支持scrollIntoViewOptions（我發現它很奇怪，但這就是現實） –

這很奇怪。你使用jQuery嗎？如果你是那麼容易，否則可能需要採取另一種方法。 – lavish

現在它支持Chrome（來自Chrome 61） –

如何使javascript scrollIntoView流暢？

回答

相關問題