网站首页 网站建设建站资讯 选模板 联系我们
易捷网络专注企业网站建设
11年企业网站建设经验、响应式网站建设，兼容PC、手机、平板全
终端，给你更佳的浏览体验...

网站制作之Jquery返回顶部按钮

来源：网站建设行业资讯网
添加时间：2022-01-15
有些网站页面过长，在返回顶部的过程中，需要不要滑动鼠标滚轮来返回顶部，这样费时又费力，今天我们制作返回顶部按钮，只需要鼠标轻轻点击一下，就可以直达页面顶部。
网页的主体部分，分别用了宽度一致（1000px）、高度各不相同、背景颜色不同、居中的四个div盒子组成，使页面的高度足够高让页面出现滚动条；返回按钮使用了固定定位（position:fixed），宽高50px的正方形div，始终靠页面右边，为了使按钮醒目背景色偏蓝，颜色白色。
Html部分和css部分比较简单在这里我就不多说了，js部分如图：



因为返回按钮一开始设置是隐藏的，所以这里用的js来控制显示隐藏，当滚动条距离顶部超过100px时，让返回按钮有过度的显示，当小于100px时有过度的隐藏。



当点击返回按钮时触发事件函数，这里使用了jquery动画来用1s的时间使滚动条自动返回顶部。简单的返回顶部按钮完成。

网站建设计最新案例赏析：

深圳大狮影业摄影广告
广州黑蜂科技有限公司
深圳信雅文化传播
陕西松峰实验设备
广东丰大机械科技
上海科宁会展服务
深圳福工精密科
广州恒星制冷设备集团
山东恒美科技
深圳华测实验室技术
 

网站建设行业资讯推荐阅读：

关键的网站建设中，影响录入和排名在哪里网页怎么做，具体步骤都有哪些企业网站建设需要了解的一些事百度、阿里、腾讯三足鼎立，再现入口之争进阶版！如何打造用户喜爱的好网站常用的网站设计工具有哪些网站建设如何才能够吸引用户小编讲解404页面存在的意义和设计技巧深圳网站建设的知识和流程如何查询域名是否有备案号来看深圳网站建设需要多少钱深圳网站建设当中要注意到哪些环节怎样设计方案出带诱惑力的网站深圳福田网站建设企业，做网站开发建设能给企业带来的好处有哪些如何很好的对官网进行网站制作优秀的深圳网站建设公司应该具备的素质消费者喜欢有价值的内容企业网站建设的好处有哪些，看完这篇文章你就会明白！深圳专业网站制作公司，企业应该要怎么制作自己的官方网站企业邮箱一定要有企业网站才能申请吗深圳网站设计：如何设计好一个网站的首页呢深圳福田专业网站建设公司，企业为什么要进行网站建设企业的网站建设需要那些基本功能偏门行业如何做好网络营销优秀的网页设计几要素深圳福田网站建设解决方案，企业网站建设注意事项知道吗科技讲解“互联网品牌”如何炼成网站脚本是什么网站建设在线教程，教你如何做网站！企业网站建设用动态网页对营销很重要合适的模板对建设网站事半功倍网站春节期间权重稳定的细节要点分析怎样才能让网站的排名比较稳定呢现在企业还有必要做网站嘛网站建设必须注意的10个SEO细节网站建设常有什么流程和步骤响应式网站建设有哪些特别之处怎么样的网站设计有利于吸引客户点击公司网站应如何设计网站提升的常见方式和实际操作流程新闻网站建设如何制作呢响应式网站制作要留意哪几个方面你怎么知道SEO的世界有多大软件定制开发差别大了解清楚再决定！营销型企业网站建设推广技巧：如何提高网站点击量云浮建站做好企业网站优化的几个重要因素 很好的网站设计制作公司报价单 关于网站建设的可访问性（二）深圳网站建设要多少钱企业网站建设的优势是什么 有实力的网站设计模板制作联系方式 企业网站如何建设分享企业建站教程跟上趋势，从这几点提升网站的用户体验度网站开发费用价格为什么有差异 企业网站设计费用 六个详细的事项，以避免网站改版升级的风险浅谈新站存在哪些方面的不足影响网站建设时间的因素选择高质量的外链提高网站的质量网站多久需要改版来自世界较先进的网站设计
企业网站建设行业信息服务发布平台！
（www.fantodo.com）版权所有
QQ在线咨询
网站建设
企业邮箱
域名申请
空间购买
推广优化
网站维护
网站备案
论坛制作