js 回到顶部效果的实现代码

2014-04-08

  js 回到顶部效果的实现代码,只做简单介绍。XT6七七世界-网站建设|UI设计|人资系统|二次开发

  代码如下:XT6七七世界-网站建设|UI设计|人资系统|二次开发
     //speed 滚动速度 time 时间间隔XT6七七世界-网站建设|UI设计|人资系统|二次开发
     function gotoTop(speed,time){XT6七七世界-网站建设|UI设计|人资系统|二次开发
     speed = speed || 0.1;XT6七七世界-网站建设|UI设计|人资系统|二次开发
     time = time || 16;XT6七七世界-网站建设|UI设计|人资系统|二次开发
     // 滚动条到页面顶部的水平距离XT6七七世界-网站建设|UI设计|人资系统|二次开发
     var x = document.body.scrollLeft;XT6七七世界-网站建设|UI设计|人资系统|二次开发
     // 滚动条到页面顶部的垂直距离XT6七七世界-网站建设|UI设计|人资系统|二次开发
     var y = document.body.scrollTop;XT6七七世界-网站建设|UI设计|人资系统|二次开发
     // 滚动距离 = 目前距离 / 速度, 因为距离原来越小, 速度是大于 1 的数, 所以滚动距离会越来越小XT6七七世界-网站建设|UI设计|人资系统|二次开发
     speed++;XT6七七世界-网站建设|UI设计|人资系统|二次开发
     window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));XT6七七世界-网站建设|UI设计|人资系统|二次开发
     // 如果距离不为零, 继续调用迭代本函数XT6七七世界-网站建设|UI设计|人资系统|二次开发
     if(x > 0 || y > 0) {XT6七七世界-网站建设|UI设计|人资系统|二次开发
     window.setTimeout("gotoTop(" + speed + ", " + time + ")", time);XT6七七世界-网站建设|UI设计|人资系统|二次开发
     }XT6七七世界-网站建设|UI设计|人资系统|二次开发
     }XT6七七世界-网站建设|UI设计|人资系统|二次开发

 XT6七七世界-网站建设|UI设计|人资系统|二次开发

本文关键词:顶部  效果  代码