问题1：大神们，去看看这个：http://imyuao.com/，这个网址的回到顶部的效果，有谁会的?
当点击top这张图片， 你看它的纵向滚动条的效果。 带有弹性的，大神，这个代码应该是JS实现的。
可是小弟才疏学浅，代码不会写，大神们，请求这种效果的源码，我看了下这个网站的代码，没看明白，然后百度也查了，只可惜
没找到，没这种效果，说句老实话。这种效果小弟第一次见，请大神们，写出这种效果的代码，然后测试成功后，把代码贴上来，
大家共同分享。
问题2：大神，如果上面的效果没实现，那知道云飘动的JS代码，就是它网站那种云飘动的效果的。大神们，实现了其中任何一个。我分全部给你。
急急急！！！ 在此谢过了，大神们。
最简单的返回顶部就是 window.scroll(0, 0)
参考 http://www.w3school.com.cn/htmldom/met_win_scrollto.asp
有滑动效果的就是 点击时 动态改变scrollTop的值，直到为0结束
有弹性效果的就是上面滑动效果的一种变形
楼主可以研究下
http://www.cnblogs.com/cloudgamer/archive/2009/01/06/Tween.html2
云飘的效果就是用了这个图片
http://imyuao.com/assets/snowpink/clouds.png
采用了传说中的css sprite，视情况改变top left，
比如
<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
div {
margin:0 auto;
width:800px; /*1320*/
height:513px;
background:url(http://whoisleon.com/wp-content/themes/whoisleon/images/n_cloud1.jpg) repeat-x;
}
</style>
</head>
<body>
<div id="test"></div>
<script>
var $ = function(id){
return document.getElementById(id);
};
var obj = $('test');
var i = 0;
setInterval(function(){
obj.style.backgroundPosition = (--i)+'px';
}, 30)
</script>
</body>
</html>google的logo大量使用了这样的方式
比如 父亲节的
http://www.google.com.hk/
window.scrollTo(0, 0)
回复4楼：大神，很感谢你是如此的详细的解答小弟的问题，小弟在此谢过了，呵呵。但是...问题并没有得到解决，哎...大神。纵向滚动条弹性回到顶部，那个涉及到JavaScript Tween算法及缓动效果，大神，真心不会算法，大神，求源码。大神，第二个效果：云飘动的效果也被Pass掉了，我把你的代码复制下来测试，结果报的是500错误，语法错误。对了，忘了和大神说了，我是用JSP做的，我不知道哪里错了，本来想看看效果的，大神，你测试了你的代码吗? 有云飘动的效果? 大神，再次赐教。 小弟再次谢过了，真心感谢！大神，你测试出效果后把代码贴上来，大家一起分享！谢谢了!
上面的例子，把代码复制下来， 另存为 ***.html, 双击即可看见效果了.
2. 找到最后的"回到顶部",id为"backtop"
2. search ".js"
3. for each link contains ".js", click to view the source, then search for "#backtop". You will find this:
$('#backtop').click(function(){
$.scrollTo(0,2500,{easing:'easeOutBounce'});
return false;
});
回复9楼，看见效果了，可是放到JSP就报500错误，郁闷了，可能是人品问题吧，呵呵。好像是一幅画在动的效果，很漂亮，谢谢，大神。
我贴的代码是从你发的网站代码里copy的。贴出你实验的代码。你的代码加载时报错了吗？什么错？
大神，我知道你是从网站Copy的，它是用Jquery实现的。我的代码如下：
<%@ page language="java" import="java.util.*" pageEncoding=utf-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript" src="js/jquery-1.4.1.js"></script>
<script type="text/javascript" language="javascript">
$('#backtop').click(function(){
$.scrollTo(0,2500,{easing:'easeOutBounce'});
return false;
});
</script>
</head>
<body>
<div><img id="backtop" alt="回到顶部" src = "style/images/backtotop.gif" title="回到顶部" /></div>
</body>
</html>它报的是500错误。500就是语法有错误，我都不知道哪错了?
然后我....用记事本实现，没有报错，我建了一个js文件夹，把Jquery的那个包放进去了。然后代码如下，为了测试效果，看滚动条的效果：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style> body{ width:800px;
height:800px; }
.div1{ width:800px;
height:150px;
border:2px solid red; }
.div2{ width:800px;
height:500px;
border:2px solid yellow; }
</style> <script type="text/javascript" src="js/jquery-1.4.1.js"></script>
<script type="text/javascript" language="javascript">
$('#backtop').click(function(){
$.scrollTo(0,2500,{easing:'easeOutBounce'});
return false;
});
</script>
</head>
<body>
<div class="div1"></div>
<div class="div2"></div>
<div><img id="backtop" style="text-align: center;" alt="回到顶部" src = "http://www.imyuao.com/assets/snowpink/backtotop.gif?ver=1" title="回到顶部" /></div>
</body>
</html>然后将其存为html的后缀名，点击top图片，滚动条丝毫没有反应，大神。此代码仅此是为了测试，因为在Tomcat下报500错误，所以，我用记事本将其存为html的后缀看效果。没有效果啊，大神。大神，你也可以试试看，看是否能出来效果，小弟在此谢过了，感激不尽。
我知道不会出效果的，关键是为什么不会出效果。浏览器加载你的网页时或你点击“backtop”时是否有错？这个错怎么解决？
大神，不是，我用Tomcat加载网页的时候就报500错误，而不是点击Top图片的时候，但是我用记事本改了后缀名生成的html页面加载时候就不会，不知道为什么，但是生成的html页面，点击top图片没有效果。大神，你知道不会出效果? 为什么啊? 能解析一下吗? 求解。
大神，如下是它在Tomcat下报的错误:500错误2012-6-18 6:33:27 org.apache.catalina.core.AprLifecycleListener init
信息: The Apache Tomcat Native library which allows optimal performance in production environments was not found on the java.library.path: E:\JAVA\binary\com.sun.java.jdk.win32.x86_1.6.0.013\bin;E:\JAVA\plugins\com.genuitec.eclipse.easie.tomcat.myeclipse_8.0.0.me200911090405\tomcat\bin
2012-6-18 6:33:27 org.apache.coyote.http11.Http11Protocol init
信息: Initializing Coyote HTTP/1.1 on http-8080
2012-6-18 6:33:27 org.apache.catalina.startup.Catalina load
信息: Initialization processed in 950 ms
2012-6-18 6:33:27 org.apache.catalina.core.StandardService start
信息: Starting service Catalina
2012-6-18 6:33:27 org.apache.catalina.core.StandardEngine start
信息: Starting Servlet Engine: Apache Tomcat/6.0.13
2012-6-18 6:33:29 org.apache.coyote.http11.Http11Protocol start
信息: Starting Coyote HTTP/1.1 on http-8080
2012-6-18 6:33:29 org.apache.jk.common.ChannelSocket init
信息: JK: ajp13 listening on /0.0.0.0:8009
2012-6-18 6:33:29 org.apache.jk.server.JkMain start
信息: Jk running ID=0 time=0/54 config=null
2012-6-18 6:33:29 org.apache.catalina.startup.Catalina start
信息: Server startup in 2488 ms
2012-6-18 6:33:59 org.apache.catalina.startup.HostConfig checkResources
信息: Reloading context [/Blogs]
2012-6-18 6:35:35 org.apache.catalina.core.StandardWrapperValve invoke严重: Servlet.service() for servlet jsp threw exception
org.apache.jasper.JasperException: /Test.jsp(1,61) quote symbol expected
at org.apache.jasper.compiler.DefaultErrorHandler.jspError(DefaultErrorHandler.java:40)
at org.apache.jasper.compiler.ErrorDispatcher.dispatch(ErrorDispatcher.java:407)
at org.apache.jasper.compiler.ErrorDispatcher.jspError(ErrorDispatcher.java:88)
at org.apache.jasper.compiler.Parser.parseAttribute(Parser.java:200)
at org.apache.jasper.compiler.Parser.parseAttributes(Parser.java:150)
at org.apache.jasper.compiler.Parser.parseAttributes(Parser.java:162)
at org.apache.jasper.compiler.ParserController.getPageEncodingForJspSyntax(ParserController.java:451)
at org.apache.jasper.compiler.ParserController.determineSyntaxAndEncoding(ParserController.java:392)
at org.apache.jasper.compiler.ParserController.doParse(ParserController.java:173)
at org.apache.jasper.compiler.ParserController.parse(ParserController.java:103)
at org.apache.jasper.compiler.Compiler.generateJava(Compiler.java:167)
at org.apache.jasper.compiler.Compiler.compile(Compiler.java:306)
at org.apache.jasper.compiler.Compiler.compile(Compiler.java:286)
at org.apache.jasper.compiler.Compiler.compile(Compiler.java:273)
at org.apache.jasper.JspCompilationContext.compile(JspCompilationContext.java:566)
at org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:317)
at org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:320)
at org.apache.jasper.servlet.JspServlet.service(JspServlet.java:266)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:803)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:230)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:128)
at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:104)
at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:261)
at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:844)
at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:581)
at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:447)
at java.lang.Thread.run(Thread.java:619)
$('#backtop').click(function(){
$.scrollTo(0,2500,{easing:'easeOutBounce'});
return false;
});
把它改为：
$(function() {
$('#backtop').click(function(){
$.scrollTo(0,2500,{easing:'easeOutBounce'});
return false;
});
});
2. 这时在加载，点击，浏览器会报错（这是firebug的错误信息，你的机器上看到的也许不一样）：$.scrollTo is not a function
[Break On This Error] $.scrollTo(0,2500,{easing:'easeOutBounce'});3. 到这里，要搜索的目标很明显了：“jquery scrollTo”，搜索后发现这是一个jquery plugin。在你的代码里加上这个，应该就可以了。我没测试，要是这还不行，就得再等高人了。总结：a. 一些不起眼的小错误会掩盖你探索的线索，你不知道是小错误还是大方向就错了。如1中的错误，使得浏览器根本不会报错。
b. 养成看文档的习惯，而不是照搬。如果看到“$.scrollTo(0,2500,{easing:'easeOutBounce'});”这一句，你先去找jquery中scrollTo的文档，直接就能发现它是一个plugin，要另外加载。
c. 熟悉各种开发工具。你很有耐心，这在在这儿问问题的人中可不多见，祝你一切顺利。
呵呵，大神，首先很感谢你对我说的话，然后感谢你是如此的热心的回答我的问题，小弟在此谢过了，呵呵。大神，我上JQuey帮助文档查了，不过没找到这个函数啊? scrollTo, 我的帮助文档是： jQuery 1.4.1 中文参考，昨天请朋友帮忙看了这个代码，也就是你贴的那句---JQuery那句代码，他给出的结果也是没有这个函数，只找到了： scroll(fn); scrollLeft(); scrollTop(); scrollTop(val); 就是没有 scrollTo()这个函数的用法，我郁闷了....大神，很感谢你对我说的那番话，呵呵，小弟受教了，教会了我很多....呵呵。谢谢你!
兄弟，看到第3条没？3. 到这里，要搜索的目标很明显了：“jquery scrollTo”，搜索后发现这是一个jquery plugin。在你的代码里加上这个，应该就可以了。我没测试，要是这还不行，就得再等高人
我已经给你搞出来了，测试没问题测试代码如下，多给点分哈<html>
<head>
<title></title>
<script language="javascript" type="text/javascript" src="aaa.js"></script>
</head>
<body>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
aasdasd
<br/>
<br/>
<br/>
aasdasd
aasdasd
aasdasd
aasdasd
aasdasd
<br/>
<a id="backtop">回到顶部</a>
</body>
</html>
<script type="text/javascript">
jQuery.extend(jQuery.easing,
{
easeOutBounce: function (x, t, b, c, d) {
if ((t /= d) < (1 / 2.75)) {
return c * (7.5625 * t * t) + b;
} else if (t < (2 / 2.75)) {
return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;
} else if (t < (2.5 / 2.75)) {
return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;
} else {
return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;
}
}
});
//---scrollTo----//
(function (d) { var k = d.scrollTo = function (a, i, e) { d(window).scrollTo(a, i, e) }; k.defaults = { axis: 'xy', duration: parseFloat(d.fn.jquery) >= 1.3 ? 0 : 1 }; k.window = function (a) { return d(window)._scrollable() }; d.fn._scrollable = function () { return this.map(function () { var a = this, i = !a.nodeName || d.inArray(a.nodeName.toLowerCase(), ['iframe', '#document', 'html', 'body']) != -1; if (!i) return a; var e = (a.contentWindow || a).document || a.ownerDocument || a; return d.browser.safari || e.compatMode == 'BackCompat' ? e.body : e.documentElement }) }; d.fn.scrollTo = function (n, j, b) { if (typeof j == 'object') { b = j; j = 0 } if (typeof b == 'function') b = { onAfter: b }; if (n == 'max') n = 9e9; b = d.extend({}, k.defaults, b); j = j || b.speed || b.duration; b.queue = b.queue && b.axis.length > 1; if (b.queue) j /= 2; b.offset = p(b.offset); b.over = p(b.over); return this._scrollable().each(function () { var q = this, r = d(q), f = n, s, g = {}, u = r.is('html,body'); switch (typeof f) { case 'number': case 'string': if (/^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(f)) { f = p(f); break } f = d(f, this); case 'object': if (f.is || f.style) s = (f = d(f)).offset() } d.each(b.axis.split(''), function (a, i) { var e = i == 'x' ? 'Left' : 'Top', h = e.toLowerCase(), c = 'scroll' + e, l = q[c], m = k.max(q, i); if (s) { g[c] = s[h] + (u ? 0 : l - r.offset()[h]); if (b.margin) { g[c] -= parseInt(f.css('margin' + e)) || 0; g[c] -= parseInt(f.css('border' + e + 'Width')) || 0 } g[c] += b.offset[h] || 0; if (b.over[h]) g[c] += f[i == 'x' ? 'width' : 'height']() * b.over[h] } else { var o = f[h]; g[c] = o.slice && o.slice(-1) == '%' ? parseFloat(o) / 100 * m : o } if (/^\d+$/.test(g[c])) g[c] = g[c] <= 0 ? 0 : Math.min(g[c], m); if (!a && b.queue) { if (l != g[c]) t(b.onAfterFirst); delete g[c] } }); t(b.onAfter); function t(a) { r.animate(g, j, b.easing, a && function () { a.call(this, n, b) }) } }).end() }; k.max = function (a, i) { var e = i == 'x' ? 'Width' : 'Height', h = 'scroll' + e; if (!d(a).is('html,body')) return a[h] - d(a)[e.toLowerCase()](); var c = 'client' + e, l = a.ownerDocument.documentElement, m = a.ownerDocument.body; return Math.max(l[h], m[h]) - Math.min(l[c], m[c]) }; function p(a) { return typeof a == 'object' ? a : { top: a, left: a} } })(jQuery); jQuery(function ($) {
$('#backtop').click(function () {
$.scrollTo(0, 2500, { easing: 'easeOutBounce' });
return false;
});
});
</script>
朋友， 你说我那个 asterion.js我没看见，你实现了效果? 而且你说的话，我不是不明白，方便的话，你可以留下Q，Q上聊，而且...我很多东西要控制的，比如说是样式，你的虽然效果是出来了，但是我还要控制它出项的地方，呵呵，方便的话，留下Q吧，朋友。
当然，这种改变是非线性的，有的人称为缓动，可以有很多种方式。在AS的函数库中，就预置了这样的非线性缓动函数——Tween算子。
把AS的Tween写成JS，成为了目前JQ等缓动选择的滥觞。为了紧凑些，我提取AS的Tween改写如下，方便JS缓动直接调用：var Tween = {
linear : function(t,b,c,d){return c*t/d+b},
easeIn : {
quad : function(t,b,c,d){return c*(t/=d)*t+b},
cubi : function(t,b,c,d){return c*(t/=d)*t*t+b},
quar : function(t,b,c,d){return c*(t/=d)*t*t*t+b},
quin : function(t,b,c,d){return c*(t/=d)*t*t*t*t+b},
sine : function(t,b,c,d){return -c*Math.cos(t/d*(Math.PI/2))+c+b},
expo : function(t,b,c,d){return t==0?b:c*Math.pow(2,10*(t/d-1))+b},
circ : function(t,b,c,d){return -c*(Math.sqrt(1-(t/=d)*t)-1)+b},
back : function(t,b,c,d){return c*(t/=d)*t*((1.70158+1)*t-1.70158)+b},
boun : function(t,b,c,d){return c-Tween.easeOut.boun(d-t,0,c,d)+b},
elas : function(t,b,c,d){return t==0?b:(t/=d)==1?b+c:-(c*Math.pow(2,10*(t-=1))*Math.sin((t*d-d*.3/4)*(2*Math.PI)/(d*.3)))+b}
},
easeOut : {
quad : function(t,b,c,d){return -c*(t/=d)*(t-2)+b},
cubi : function(t,b,c,d){return c*((t=t/d-1)*t*t+1)+b},
quar : function(t,b,c,d){return -c*((t=t/d-1)*t*t*t-1)+b},
quin : function(t,b,c,d){return c*((t=t/d-1)*t*t*t*t+1)+b},
sine : function(t,b,c,d){return c*Math.sin(t/d*(Math.PI/2))+b},
expo : function(t,b,c,d){return (t==d)?b+c:c*(-Math.pow(2,-10*t/d)+1)+b},
circ : function(t,b,c,d){return c*Math.sqrt(1-(t=t/d-1)*t)+b},
back : function(t,b,c,d){return c*((t=t/d-1)*t*((1.70158+1)*t+1.70158)+1)+b},
boun : function(t,b,c,d){return (t/=d)<(1/2.75)?c*(7.5625*t*t)+b:t<(2/2.75)?c*(7.5625*(t-=(1.5/2.75))*t+.75)+b:
t<(2.5/2.75)?c*(7.5625*(t-=(2.25/2.75))*t+.9375)+b:c*(7.5625*(t-=(2.625/2.75))*t+.984375)+b;
},
elas : function(t,b,c,d){return t==0?b:(t/=d)==1?b+c:(c*Math.pow(2,-10*t)*Math.sin((t*d-d*.3/4)*(2*Math.PI)/(d*.3))+c+b)}
},
easeInOut : {
quad : function(t,b,c,d){return (t/=d/2)<1?c/2*t*t+b:-c/2*((--t)*(t-2)-1)+b},
cubi : function(t,b,c,d){return (t/=d/2)<1?c/2*t*t*t+b:c/2*((t-=2)*t*t+2)+b},
quar : function(t,b,c,d){return (t/=d/2)<1?c/2*t*t*t*t+b:-c/2*((t-=2)*t*t*t-2)+b},
quin : function(t,b,c,d){return (t/=d/2)<1?c/2*t*t*t*t*t+b:c/2*((t-=2)*t*t*t*t+2)+b},
sine : function(t,b,c,d){return -c/2*(Math.cos(Math.PI*t/d)-1)+b},
expo : function(t,b,c,d){return t==0?b:t==d?b+c:(t/=d/2)<1?c/2*Math.pow(2,10*(t-1))+b:c/2*(-Math.pow(2,-10*--t)+2)+b},
circ : function(t,b,c,d){return (t/=d/2)<1?-c/2*(Math.sqrt(1-t*t)-1)+b:c/2*(Math.sqrt(1-(t-=2)*t)+1)+b},
back : function(t,b,c,d){var s=1.70158; return (t/=d/2)<1?c/2*(t*t*(((s*=(1.525))+1)*t-s))+b:c/2*((t-=2)*t*(((s*=(1.525))+1)*t+s)+2)+b},
boun : function(t,b,c,d){return t<d/2?Tween.easeIn.boun(t*2,0,c,d)*.5+b:Tween.easeOut.boun(t*2-d,0,c,d)*.5+c*.5+b},
elas : function(t,b,c,d){return t==0?b:(t/=d/2)==2?b+c:t<1?-.5*(c*Math.pow(2,10*(t-=1))*Math.sin((t*d-d*(.3*1.5)/4)*
(2*Math.PI)/(d*(.3*1.5))))+b:c*Math.pow(2,-10*(t-=1))*Math.sin((t*d-d*(.3*1.5)/4)*(2*Math.PI)/(d*(.3*1.5)))*.5+c+b;
}
}
}
其中，Tween.easeOut.boun就是LZ想要的缓动效果，其实Tween.easeOut.elas等也是很常用的不错效果。
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<script>
function easeOut(t,b,c,d){
if ((t/=d) < (1/2.75)) {return c*(7.5625*t*t) + b;}
else if (t < (2/2.75)){return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;}
else if (t < (2.5/2.75)){return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;}
else {return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;}
}
function toTop(){
var sTop=document.documentElement.scrollTop;
var t=0;b=sTop,c=(0-sTop),d=100;
var interval=setInterval(
function(){
t++;
document.documentElement.scrollTop=Math.ceil(easeOut(t,b,c,d));
if(t>=d) clearInterval(interval);
},10
);
}
</script>
</head>
<body>
<div style="width:960px;height:2000px;border:solid 1px green;margin:0 auto;">
<div style="margin-top:200px;height:50px;background:orange;"></div>
</div>
<div id="d_top" style="width:20px;height;50px;border:solid 1px red;position: absolute;right:10px;cursor: pointer;" onclick="toTop()">
回顶部
</div>
</body>
</html>
Chrome下沒任何效果
var sTop=Math.max(document.documentElement.scrollTop,document.body.scrollTop);
var t=0;b=sTop,c=(0-sTop),d=100;
var interval=setInterval(
function(){
t++;
document.documentElement.scrollTop=Math.ceil(easeOut(t,b,c,d));
document.body.scrollTop=Math.ceil(easeOut(t,b,c,d));
if(t>=d) clearInterval(interval);
},10
);
}
測試一下Chrome可以用了，謝謝賜教！
流金岁月，非常感谢你,呵呵，真的，只可惜你的代码量太多了，不好控制，虽说是源码那来的....呵呵，但是我要控制样式就比较麻烦了，流金岁月，你会得到分的，呵呵，楼上的全部哥们，真的很感谢你们，真的.....等whatisma解说了代码，呵呵。 小弟立马结贴， 个个都有分，因为楼上的哥们都出了一份力，真的很感谢你们...大神们，小弟在此谢过了。
关键的是如何获取当前滚动条应该所在的位置，这就是靠easeOut这个算法了，这个当然不是我写的。
四个参数t=现在时间，b=初始值，c=变化量，d=持续时间，有兴趣的话你可以搜索Tween算法详细看看介绍后也可以做出与这个相反地效果。
大哥，代码不多吧，就把实现这个效果的3个简短的js函数弄出来了而已，上面N多换行和乱写的html代码只是把html页面撑下去这样才能看见效果，其它一个jq库，我只是不知道是哪个版本可以支持，你可以试试。我想不通就那个是点击回到弹回到顶部和样式有啥关系呢？它只是控制页面滚动条的效果而已，实在不知道和样式有啥关系了
jQuery(function($){
$('#backtop').click(function(){
$.scrollTo(0,2500,{easing:'easeOutBounce'});
return false;
});
$('#gotocomment').click(function(){
$.scrollTo('#comment_form_area',2500,{easing:'easeOutBounce'});
return false;
});
$('.comment_number').click(function(){
$("#new_comment_body").text("@"+jQuery(this).parent().parent().find(".comment_name").text()+": ");
$.scrollTo('#comment_form_area',500,{easing:'swing'});
return false;
});
});