0

我有一个页面,左侧有一个菜单,其中包含右侧元素的锚点。单击左侧锚点时,我希望它仅垂直滚动(而不是水平滚动),以便无论如何左侧菜单都保留在屏幕上。基本上,我想要一个仅垂直的锚。

4

2 回答 2

1

要么像这样使用 jquery:

$('a[href^="#"]').on('click', function(event) {
 target = this.id.offset().top;
 $('html,body').animate({
   scrollTop: target
  }, 1000);
event.preventDefault();
}

“点击页面内的任何链接,获取页面顶部的偏移量,并在 1 秒内将滚动动画向下滚动到该位置。”

或使用此插件http://flesler.blogspot.com/2007/10/jqueryscrollto.html进行更多控制。

于 2013-04-16T09:05:50.080 回答
0

一个插入式解决方案,香草 JS:

const scrolledParentSelector = ".app-content"; // or e.g. body
const scrolled = document.querySelector(scrolledParentSelector);

const anchors = document.querySelectorAll("a[href^='#']"); // hash tag anchor href starts with '#'
anchors.forEach(a => {
  a.onclick = function(e) {
    e.preventDefault();
    const href = a.getAttribute("href").slice(1); // remove initial '#'
    const target = document.querySelector(`[id='${href}']`);
    const top = target.offsetTop;
    scrolled.scrollTop = top;
  };
});
于 2019-09-21T10:06:57.690 回答