Question

我理解如何通过引用它们来轻松滚动到锚点......

<a href = "#div1">Click here to go to div!</a>
<div id = "div1">Stuff in your div</div>

我遇到了问题，因为我在顶部有一个音乐播放器，其位置设置为固定，所以当我尝试锚时，它会切断我的div的顶部。

如果您想要一个示例，请查看我的页面here。点击帖子的图片开始播放歌曲，然后点击“View Post”的东西，它应该带你到正确的帖子，但你可以看到顶部被切断了。

是否有一种简单的方法来获得某种类型的偏移或其他东西，以便我可以解决这个问题。另外，我是否可以这样做，以便它不会改变网站的网址到最后有什么？＃/ p>

Answer 1

这可以使用javascript，偏移量变量必须根据所需的偏移量

进行更改

使用Javascript：

function getpos(myElement)
        {
            var offset = 20;
            window.scrollTo(0, 0);
            var rect = myElement.getBoundingClientRect();
            window.scrollTo(rect.left , rect.top - offset);
        }

HTML：

<div id="yourElementId" onclick="getpos(this);">image or another element</div>

窗口将滚动到ID为'yourElementId'且偏移量为'20'的已点击元素

如何滚动到具有偏移量的锚点？

1 个答案: