页面滚动条居底

页面滚动条居底

2011-05-10 16:58:36|  分类： 工作笔记 |  标签：js控制  滚动条  底部  居底  scrollto   |字号大中小 订阅

今天在工作中遇到这样一个需求，表单填写好点提交按钮时，判断是否阅读一份“声明”，点链接就在提交按钮下面弹出一个DIV，里面是“声明”的正文；功能做好后发现了问题，由于提交按钮正好在页面第一屏的底部，产品设计的弹出DIV又在它的下面，所以当触发事件DIV弹出后，只能看到一小条内容；

这不是我们想要的，怎么解决？如果点击链接，DIV弹出的同时，页面滚动条拉到底部，不就可以显示完全了吗~

按着这个思路去做，具体有两个方案可以实现：

1）JS实现：window.scrollTo(0,document.body.scrollHeight);

2）JS控制锚点：window.location.hash='ToBottom';

说说这两个方案的区别，如果只想让滚动条拉到底的话

第一种方案比较适用

；如果想更精确的控制滚动的位置，那就用第二种方案，把一个<a name="

ToBottom

">标签当作锚点放到你想到跳到的具体位置，然后触发事件时加上这句

window.location.hash='ToBottom';

PS: 类似DIV中要滚动条居底可以这样去写

 

以上为不点按钮执行。点按钮要实现这个效果就用锚链接