html - 仅使用 CSS/HTML 平滑滚动到页面顶部?

标签 html css

我不允许在这个网站上添加 Jquery/Javascript,所以我一直在寻找任何方法来做一个“返回顶部”按钮,并让它仅使用 CSS/HTML 转换到顶部....don '认为这是可能的,但检查是否有人遇到了解决方案。

最佳答案

它不会是一个平滑的滚动,但你可以使用一个 achor 标签链接到页面的任何部分。这是 W3 学校的示例。

<!DOCTYPE html>
<html>
<body>

<h2><a id="top">There is a link at the bottom of the page!</a></h2>

<p>In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since.</p>
<p>"Whenever you feel like criticizing any one," he told me, "just remember that all the people in this world haven't had the advantages that you've had."</p>
<p>He didn't say any more, but we've always been unusually communicative in a reserved way, and I understood that he meant a great deal more than that. In consequence, I'm inclined to reserve all judgments, a habit that has opened up many curious natures to me and also made me the victim of not a few veteran bores. The abnormal mind is quick to detect and attach itself to this quality when it appears in a normal person, and so it came about that in college I was unjustly accused of being a politician, because I was privy to the secret griefs of wild, unknown men. Most of the confidences were unsought-frequently I have feigned sleep, preoccupation, or a hostile levity when I realized by some unmistakable sign that an intimate revelation was quivering on the horizon; for the intimate revelations of young men, or at least the terms in which they express them, are usually plagiaristic and marred by obvious suppressions. Reserving judgments is a matter of infinite hope. I am still a little afraid of missing something if I forget that, as my father snobbishly suggested, and I snobbishly repeat, a sense of the fundamental decencies is parcelled out unequally at birth.</p>
<p>And, after boasting this way of my tolerance, I come to the admission that it has a limit. Conduct may be founded on the hard rock or the wet marshes, but after a certain point I don't care what it's founded on. When I came back from the East last autumn I felt that I wanted the world to be in uniform and at a sort of moral attention forever; I wanted no more riotous excursions with privileged glimpses into the human heart. Only Gatsby, the man who gives his name to this book, was exempt from my reaction-Gatsby, who represented everything for which I have an unaffected scorn. If personality is an unbroken series of successful gestures, then there was something gorgeous about him, some heightened sensitivity to the promises of life, as if he were related to one of those intricate machines that register earthquakes ten thousand miles away. This responsiveness had nothing to do with that flabby impressionability which is dignified under the name of the "creative temperament"-it was an extraordinary gift for hope, a romantic readiness such as I have never found in any other person and which it is not likely I shall ever find again. No-Gatsby turned out all right at the end; it is what preyed on Gatsby, what foul dust floated in the wake of his dreams that temporarily closed out my interest in the abortive sorrows and short-winded elations of men.</p>

<a href="#top">Go to top</a>
</body>
</html>

基本上 href 使用 css 选择器来决定去哪个 anchor

更新: 所以我在 smooth scrolling 上找到了一个有趣的链接我想我会把它贴在这个问题上。

关于html - 仅使用 CSS/HTML 平滑滚动到页面顶部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16369095/

相关文章:

javascript - 如何使用 jQuery 检查 ul 是否具有特定的 li?

javascript - 如何在 jquery 中创建动态多级下拉列表

css - Vue.js CSS 更改按钮 onClick to href 不起作用

CSS3动画暂停/取消暂停在webkit中跳过和跳跃

html - 从普通 HTML 表格制作响应式表格

javascript - 如何避免 HTML/CSS 动态页面中滚动条的任何偏移

jquery - 将网络应用程序嵌入 PhoneGap(针对 iPhone)的选项?

jquery mobile center 在页脚中内联两个按钮

html - 使用属性在 HTML 中定位链接

jquery - 使用 Bootstrap 和 Aurelia 附加的井的随机移动