首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js点击按钮返回页面顶部

2016-08-22 03:08:28 在进行官网一类的网站建设时,经常会出现页面太长的现象,当用户滚动滚动条到最底部时返回顶部需要滚动多下滚动条,用户体验相当不好,于是就出现了当滚动条滚动到一定位置后出现返回顶部按钮...,点击按钮返回顶部,并且有一定的效果。...即给最顶部的div设置一个id,然后a标签的链接地址写成该id,当点击时就会返回顶部,但是缺点为过于突兀,因为是立即返回顶部。...点击a标签即会返回到顶部div所在位置 再来看第二种方式 第二种方式相对来说比较人性化,看起来也比较舒服,直接先来看代码吧 落帆亭博客专注web前端开发 <a class...,此事件需要进入jquery.js文件,点击之后滚动条会有一个滚动过程,不是一下子回到顶部,个人感觉不错。

25K10
您找到你想要的搜索结果了吗?
是的
没有找到

JS简单页面交互实战 - 点击按钮实现求和功能

上一期堡堡给大家讲解了简单的页面交互效果 - 点击块,让块动起来,让我们更清晰的了解JS逻辑和DOM的结合。如果想具体了解点击块,让块动起来,可以回复“交互”到“HTML5学堂”公众号。...而今天我们主要讲解JS简单页面交互实战 - 点击按钮实现求和功能。 Tips:由于上一期的文章篇幅过长,微信的文章有字数要求,所以小编把部分的内容(作用域)放到这一期进行讲解。...在实现页面交互效果的时候,会根据效果的实现思路来进行分析和实现,这也是我们文章中的一个重点。下面的文章内容主要是根据效果实现思路来分析点击按钮实现求和功能。...本文内容概要 1 点击按钮实现求和的效果图 2 实现页面交互效果的思路 3 用自己的语言进行功能的描述 4 仔细查看功能,并根据基本功能构建结构样式 5 细化功能描述并转换为JS语言或命令 6 JS具体编码以及代码优化...我们来想一个问题,假如页面中出现了多个点击按钮实现求和功能,你是把代码复制黏贴一遍还是进行代码的封装?

17.5K80

win10 uwp 处理用户点击关闭按钮

在 UWP 开发的时候,我做的文档软件需要在文档还没有保存的时候,用户点击关闭按钮的时候告诉用户需要保存。...如何在 UWP 阻止用户点击关闭按钮退出软件,如何知道用户点击关闭按钮 在 UWP 中有限制的功能,需要在 Package.appxmanifest 中开启,关于限制的功能请看App capability...appx/manifest/foundation/windows10/restrictedcapabilities"/> 添加完成之后,就可以在代码里面使用,我在主页面的构造函数监听关闭事件...Windows.UI.Core.Preview.SystemNavigationManagerPreview.GetForCurrentView().CloseRequested += MainPage_CloseRequested; 在 MainPage_CloseRequested 触发的时候就是用户点击关闭按钮...但是在 UWP 中的提示是异步的,也就是异步的提示无法阻止事件的继续,可以看到的是在用户点击关闭的时候,软件的提示页面还没显示,软件就关闭了 在 SystemNavigationCloseRequestedPreviewEventArgs

82910

点击按钮,回到页面顶部的5种写法

document.body.scrollTop = document.documentElement.scrollTop = 0; 6 } 7 8 3.scrollTo:scrollTo(x,y)方法滚动当前...test.onclick = function(){ 5 scrollTo(0,0); 6 } 7 8 4.scrollBy():scrollBy(x,y)方法滚动当前...window中显示的文档,x和y指定滚动的相对量,只要把当前页面的滚动长度作为参数,逆向滚动,则可以实现回到顶部的效果 1 2 <button...如果为true,表示元素的顶部与当前区域的可见部分的顶部对齐(前提是当前区域可滚动);如果为false,表示元素的底部与当前区域的可见部分的尾部对齐(前提是当前区域可滚动)。...如果没有提供该参数,默认为true,使用该方法的原理与使用锚点的原理类似,在页面最上方设置目标元素,当页面滚动时,目标元素被滚动到页面区域以外,点击回到顶部按钮,使目标元素重新回到原来位置,则达到预期效果

2.3K30

对抗蠕虫 —— 如何让按钮不被 JS 自动点击

在社交网络里,很多操作都是通过点击按钮发起的,例如发表留言。...演示 Demo: http://www.etherdream.com/FunnyScript/anti-xssworm/ 注意:这个案例不是看能不能注入 XSS,而是看能不能通过当前页面JS 自动发留言...细节: 使用者加载 safebutton.js,引入 SafeButton 类 使用者实例化 SafeButton 对象 A,创建出一个不同源的 iframe 作为按钮界面 用户点击 iframe 按钮后...,内部变量 S 置为 true,同时将点击消息告知主页面(postMessage) 主页面收到消息后,让 A 产生 onclick 事件 使用者将 HTTP 请求数据,通过 A 的 send 方法扔给...正是这一步,使得未经用户点击,XSS 强制扔给 iframe 的消息变得无效! ? 缺陷 当然,这个方案阻挡不了点击劫持 —— XSS 可以把 iframe 元素放大至整个页面,并设置全透明。

9.1K60
领券