javascript - 固定元素动画在顶部滚动主体

Question

我又发了一遍，但我想我的问题还不够清楚。

我有一个“隐藏”的固定元素，我想在单击它时从侧面打开它。

风格:

<style>
#fixed {
    position: fixed;
    width: 200px;
    top: 120px;
    left: -200px;
    height: 200px;
    z-index: 5;
}

.leftc {
    left: 0 !important;
}
</style>

HTML:

<div id="fixed">
<div id="fixedbtn"><a href=#>btn</a></div>
</div>

J查询:

<script>
$("#fixedbtn a").click(function(e) {
  $('#fixed').toggleClass('leftc');
})
</script>

所以，我的问题是，当我单击按钮时，正文会滚动回顶部!我不知道为什么会这样。我试过使用这段代码:

var windowPos = $(window).scrollTop();
$('body, html').animate({scrollTop: windowPos}, "fast");

...但我可以看到滚动条在顶部移动并返回到正确位置。我尝试删除“快速”，但没有成功。

帮助!我真的很希望有人也能解释为什么会这样；我什么都试过了!

Answer 1

它滚动正文回到顶部的原因是因为你的 href 标签，

<a href="#">btn</a>

“#”是 anchor 。示例:如果我将 a 标签的 href 设置为“#myDiv”，它将滚动到 ID 为“myDiv”的 div。由于您只输入了“#”，它只会滚动到顶部。

编辑

如果你真的想让你的a标签无处可去，你可以试试这个

<a href="JavaScript:void()">btn</a>