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