`
johnson_gong
  • 浏览: 13307 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

返回页面顶部,顶端

阅读更多
目的:实现“返回页面顶端/顶部”的动作。
背景:曾经面试被问到这个效果该怎么实现,,,额,没有答上。其实很简单的,
参考了两个网站的代码,现整理如下。

方法:
case1:使用window对象:
<a id="gotop_btn" style="" onclick="window.scroll(0, 0)"></a>

case2:使用jquery动画函数,animate:
$('html,body').animate({scrollTop:0}, 500);

case3:使用HTML标签--<link>:
<a id="tips">Useful Tips Section</a>
<a href="#tips">Visit the Useful Tips Section</a>

--- --- --- --- --- --- --- ---
有代码可参考,欢迎下载。
如有问题请留言。

ps:浏览器 请尽量使用 Chrome,Firfox;
我的IE7不好使。
分享到:
评论

相关推荐

    jQuery实现返回顶部

    在网页设计中,"返回顶部"功能是一个常见且实用的设计元素,它允许用户快速地将浏览焦点移回页面顶部,特别是在长页面滚动时。本文将深入探讨如何利用jQuery这一强大的JavaScript库来实现这一功能。 首先,jQuery是...

    jsp页面回到页面顶端

    创建一个隐藏的锚点在页面顶部: ```html &lt;a id="top"&gt;&lt;/a&gt; ``` 在页面底部添加一个链接指向这个锚点: ```html 回到顶部 ``` 用户点击这个链接时,浏览器会直接跳转到锚点所在的位置,即页面顶部。 4. **...

    网页返回顶端代码

    网页返回顶端代码是一种常见的网页交互功能,它允许用户在浏览页面时快速返回页面的顶部,无需手动滚动。这种功能在长页面中尤其有用,能够提高用户体验。本文将深入探讨实现这个功能的技术细节、常见方法以及如何在...

    jQuery带QQ客服下拉返回顶部代码.zip

    返回顶部按钮则是为了帮助用户快速回到页面顶部,避免在长页面中频繁滚动。这个功能一般通过监听滚动事件,当页面滚动到一定距离时,按钮显现;当用户点击按钮,页面将使用jQuery的动画效果平滑地滚动到顶部。这种...

    前端界面返回顶部

    它允许用户在浏览长页面时快速返回页面的顶端,而无需手动滚动。这个功能通常以一个可见的按钮或者通过鼠标滚轮双击实现,使得用户操作更加便捷。本文将深入探讨前端界面返回顶部的实现方法、设计考虑以及优化策略。...

    返回顶部按钮

    "返回顶部按钮"是网页和应用中常见的交互元素,它主要设计用于方便用户在大量内容滚动后快速返回页面的顶端。这个功能在长篇幅的文章、列表或滚动区域特别实用,比如社交媒体、论坛和电子商务网站。在本项目中,我们...

    弹性返回顶部JS代码

    在网页设计中,"返回顶部"功能是一种常见的用户体验优化手段,它允许用户快速滚动到页面的顶部,尤其在浏览长页面时更为方便。本篇主要介绍一个兼容IE6的JavaScript(简称js)实现的弹性返回顶部代码,以及如何在...

    scrollUp滑动返回顶部

    在网页和应用设计中,"scrollUp滑动返回顶部"是一个常见的用户体验功能,尤其是在内容丰富的长页面中。这个功能使得用户能够轻松快捷地从页面底部返回到顶部,无需手动滚动鼠标或滑动屏幕。下面我们将深入探讨这个...

    jquery 制作鼠标点击描点a标签返回顶部

    在网页设计中,经常需要实现一个功能:当用户滚动页面到一定位置时,提供一个返回顶部的链接,以便用户快速回到页面的顶端。这个功能可以通过jQuery库来轻松实现。jQuery是一个强大的JavaScript库,它简化了...

    jquery 返回顶端组件

    在Web开发中,随着页面内容的增多,用户滚动浏览页面时,经常需要一个方便快捷的方式返回页面顶部。jQuery提供了一种简单的方法来实现这个功能,通常被称为“返回顶部”或“顶部按钮”。这篇博客将深入探讨如何使用...

    jquery 滑动到页面顶端效果

    本篇文章将详细讲解如何利用 jQuery 实现“滑动到页面顶端”的效果,这是一种常见的用户体验优化技术,使得用户可以轻松地返回页面顶部。 首先,我们需要引入 jQuery 库。如果你的项目中还没有引入,可以通过以下...

    shopex 485返回顶端插件

    返回顶端插件在这样的背景下诞生,它的主要目的是帮助用户在浏览长页面时能够方便快捷地回到页面顶部,提高浏览效率,减少滚动操作的繁琐。 安装和使用这款插件非常简单,即便是对编程不熟悉的朋友也能轻松上手。...

    点击返回顶端.zip

    这种功能在长篇幅的网页中尤其常见,它允许用户方便地返回页面顶部,而无需手动滚动。下面将详细讨论这个功能的实现方式、应用场景以及相关技术。 网页中的“点击返回顶端”功能,通常被称为“回到顶部”或“顶部...

    微信和移动两种二维码的返回顶部代码

    在浏览长页面时,用户可能需要快速返回页面顶部,这时一个“返回顶部”的按钮或手势就能提供便利。在网页设计中,通常会通过点击一个固定在屏幕底部或侧边的图标来触发这个功能。 对于“微信和移动两种二维码”,这...

    jquery返回顶部

    在网页设计中,返回顶部的功能是一项非常实用的设计,它能够帮助用户快速地将浏览位置返回到页面的顶端,尤其在长页面中更为重要。本文将详细介绍如何使用jQuery来实现一个高效且人性化的返回顶部链接。 首先,让...

    win8扁平风格网站侧边栏在线客服返回顶部.zip

    【win8扁平风格网站侧边栏在线客服返回顶部】是一种网页设计元素,它结合了Windows 8操作系统独特的扁平化设计风格与在线客服系统,同时提供了返回页面顶部的功能。这种设计模式在现代网页中非常流行,因为它既美观...

    discuz论坛插件DZ插件 【价值36元】极致 魔方返回顶部 1.16商业版

    该插件的主要功能是提供一个快速回到页面顶部的按钮,当用户在论坛的长页面中滚动浏览时,可以方便地点击这个按钮,立即返回页面的顶端,而无需手动滚动。这种设计极大地提高了用户的浏览效率,尤其是对于那些包含...

    javascript实现博客园页面右下角返回顶部按钮

    例如,每10毫秒向上滚动30像素,直到页面顶部,可以这样编写代码: ```html ()"&gt;To Top ``` ```javascript var myVar; function TopFunc() { myVar = setInterval(EachScrollBy, 10); } function ...

    点击返回顶部

    在网页设计和用户体验领域,"点击返回顶部"功能是一个非常重要的元素,尤其对于内容丰富的长页面来说更是如此。这个功能通常以一个按钮或者链接的形式出现在页面的底部或侧边,用户只需点击它,就能快速回到页面的...

Global site tag (gtag.js) - Google Analytics