禁用css滚动平滑的scrollTo



我的元素有cssscroll-behavior:smooth,我使用它是为了平滑散列"a "链接。

我希望页面首先在页面的固定位置加载,这意味着它不会"平滑";第一次加载到该位置的滚动条只在之后使用。

我不想使用任何setTimeOut hack,我知道scrollTo有'选项';被广泛支持,但我找不到任何类型的"行为"。这将覆盖CSS平滑。

如果我得到你的问题正确-没有任何setTimeout -我想到的第一件事是简单地使用JS添加一个类(如:smoothScroll-init)到所有class="smoothScroll"元素:

HTML:

<div class="smoothScroll">Still not smooth...</div>

CSS:

/* Will be added by JS on DOM ready */
.smoothScroll-init {           
scroll-behavior: smooth;
}

JS:

// DOM is ready
// Add class "smoothScroll-init" to all class "smoothScroll" elements:
document.querySelectorAll(".smoothScroll").forEach(EL => EL.classList.add("smoothScroll-init"));

如果你的目标是一个特定的元素,你想要的目标和快速滚动到视图使用:Element/scrollIntoView使用{behavior: "auto"}选项。

相关内容

  • 没有找到相关文章

最新更新