JS控制div跳转到指定的位置的几种解决方案总结

原文：http://www.jb51.net/article/96574.htm

这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结，小编觉得挺不错的，现在分享给大家，也给大家做个参考。

总结一下自己在写这个需求遇到的问题，相信大家应该是经常遇到的。即要求滚轮滚动到指定的位置。先看下基本的解决方案。

1.给链接a加个#的方式来实现跳转。（锚点方法）这里直接贴下代码:

?
css样式：

?
该锚点法，不需要任何的js代码，即可实现跳转的方法。缺点：点击链接url发生变化，刷新的话会有问题。此方法貌似只能在.html后缀的页面才能起作用，对于.cshtml页面不起作用。

2.用animate属性，当点击锚点后，页面滚动到相应的DIV。接着上面的代码，具体添加如下代码：

html页面：

?
css样式页面同上，看下js代码如下：

?
3.简单的window.scrollTo方法使用，这里不再详细说，看下用法。

即滚动到坐标为(100,500)的地方。比较单一，且没有缓慢的效果

?
4.用js的srollIntoView方法进行使用。这里贴下代码：

html页面：

?
js代码如下：

?
注意一个问题，object.scrollIntoView(bool),前面是对象，通常原生的获取对象都是下面的写法：

?
那么如果用jquery来调用该方法的话，需要写成下面这样的：

?
5.如果需要缓慢的移动滚动可添加一个定时器。看下我们这个需求。先贴下代码：

js部分：

?
点击事件部分：

?
看下效果如下所示：



在chrome下测试和真机测试，效果都还行，这个需求主要是，没法通过高度来控制完成，因为，我们这个中间的内容元素都是动态加载进来的，高度是变得

因此我通过控制它的index来控制，固定其div模块，距离顶部的高度top为75px,滚动单个的div模块，而不是整个的body一起滚动。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。