当前位置:首页 > 全栈分享 > JavaScript > 正文
打开页面自动滚动到指定位置的实现方法
发布时间:2017-10-30 23:42:12作者:魏义齐阅读:()
本文又是竞价单页面的特殊需求,不想让用户看到的但又必须得有的就得做滚动,实现方法有两个:
一、锚链接
给需要展示的内容的地方外面加一个大的div盒子,给一个ID名称,推广链接后面加上“#名称”就可实现打开页面滚动到指定位置。
二、js代码
一、锚链接
给需要展示的内容的地方外面加一个大的div盒子,给一个ID名称,推广链接后面加上“#名称”就可实现打开页面滚动到指定位置。
二、js代码
- <script>
- window.onload = function () {
- var scroll_offset = $("#demo").offset(); //得到demo这个div层的offset,包含两个值,top和left
- $("body,html").animate({
- scrollTop: scroll_offset.top //让body的scrollTop等于demo的top,就实现了滚动
- }, 100);
- }
- </script>
- <div id="demo"></div>
上一篇:点击文字即可将文字复制到粘贴板的实现方法下一篇:屏蔽终端的js代码
赞助本站
原创不易,您的赞助就是博主更新的动力!

赞助本站可在赞助光荣榜留下外链信息,支付宝扫此二维码可领红包
最新会员
-
weiyiqi
- 网站防扒的一般措施(2188)
- js实现刷新页面所有微信号同步变化的效果(1680)
- 用swiper4给博客首页配置的一个3D方块切换轮播图(895)
- 随页面滚动动态加载内容的实现方法(876)
- 网站通用使文章图片相册式预览、左右滑动、自动切换、双击手捏放大缩小的方法(801)
- 打开页面自动滚动到指定位置的实现方法(769)
- 点击文字即可将文字复制到粘贴板的实现方法(767)
- 生日选择代码(520)
- 如何让一个div块在页面滚动到其出现之后在当前窗口的位置不再发生变化(519)
- 屏蔽终端的js代码(515)
- jQuery解决谷歌广告不显示但使打底广告无法点击问题(2021-08-12)
- 网站通用使文章图片相册式预览、左右滑动、自动切换、双击手捏放大缩小的方法(2019-06-10)
- 用swiper4给博客首页配置的一个3D方块切换轮播图(2018-10-29)
- 表单验证常用的正则表达式(2018-03-17)
- 如何让一个div块在页面滚动到其出现之后在当前窗口的位置不再发生变化(2018-03-15)