如何优雅地取消页面滚动恢复行为?

通常我们在浏览web页面时,当浏览到某个位置跳去了其它页面浏览后再回到开始时的那个页面时,浏览器会帮我们重新定位到我们离开页面时的位置,对于绝大多数场景来说,这确实是一个非常好的体验设计!但有时候我们往往不想这样,这个时候我们是不是通常会使用scrollTop来解决这一问题,今天我们再来介绍一种更佳优雅的方法scrollRestoration。,我们平常在web页面中会用到:history.forward()、history.back()或history.go(1)之类的操作,但history还有另外一个神奇的属性 —— 「scrollRestoration 滚动恢复」。,History 的接口—— 「滚动恢复属性」 允许 web 应用程序在历史导航上显式地设置默认滚动恢复行为,文档上虽然并没有明确说明谁是默认值,但从我们的平常使用体验上来将,这个默认值应该就是auto。当然我们也可以自行验证,找一个自己的页面在浏览器打开,然后在控制台输入history。,如何优雅地取消页面滚动恢复行为?,这里我们就能看到history.scrollRestoration的默认值就是auto。,所以也就是说如果浏览器支持history.scrollRestoration并且值为auto则会默认的滚动恢复行为,如果设置为manual则可以取消滚动恢复行为,这种方式相对于我们常用的scrollTop要更加的优雅。,图片

文章版权声明

 1 原创文章作者:cmcc,如若转载,请注明出处: https://www.52hwl.com/20818.html

 2 温馨提示:软件侵权请联系469472785#qq.com(三天内删除相关链接)资源失效请留言反馈

 3 下载提示:如遇蓝奏云无法访问,请修改lanzous(把s修改成x)

 免责声明:本站为个人博客,所有软件信息均来自网络 修改版软件,加群广告提示为修改者自留,非本站信息,注意鉴别

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023年3月5日 上午12:00
下一篇 2023年3月7日 下午10:34