gpt4 book ai didi

html - 转到页面顶部

转载 作者:行者123 更新时间:2023-11-28 04:44:43 25 4
gpt4 key购买 nike

我在页面的一侧创建了一个图标,单击该图标可以返回页面顶部。

我认为这会相当简单,就像这样:

#back_to_top{
position:fixed;
right:0px;
bottom:80px;
padding:10px;
background-color:#fff;
opacity:0.5;
border-radius:10px 0px 0px 10px;
cursor:pointer;
}
#back_to_top img{
width:50px;
height:50px;
}
#content{
height:9999px;
}
<a id="top_of_page"></a>

<div id="content">loads of content</div>

<div id="back_to_top">
<a href="#top_of_page">
<img src="media/top.png">
</a>
</div>

但是,当我单击该图标时,它实际上每次都在页面上向下移动相同数量的像素。

  • 我没有其他 anchor 或任何其他具有类似 ID 的东西。
  • 我的 anchor 标签是我体内的第一个标签。
  • 我的“大量内容”都是从 php 动态生成的。

我知道它在代码段中的工作原理,但我无法分享完整的示例,但是,对于为什么会以这种方式起作用的任何想法,我们将不胜感激。

最佳答案

使用 href="#" 添加一个 a 元素应该可以解决问题。

这里有一个它工作的例子:

<h1>MOON</h1>
<div style="height: 700px;"><small>scroll down</small></div>
<a href="#">To the moon!</a>

关于html - 转到页面顶部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51844022/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com