`
xupeng73
  • 浏览: 10978 次
  • 性别: Icon_minigender_1
  • 来自: 成都
文章分类
社区版块
存档分类
最新评论

JS滚动顶部

 
阅读更多
function goTop(acceleration, time) {
  acceleration = acceleration || 0.1;//加速度 acceleration
   time = time || 15;//时间间隔
var x=0,y=0;

if (document.documentElement) {
   x = document.documentElement.scrollLeft|| 0;
   y = document.documentElement.scrollTop || 0;
}

var speed = 1 + acceleration;//滚动速度
      //  floor()返回值为小于等于其数值参数的最大整数值 假如 y=36 speed=1.1   36/1.1=32;
      // scrollTo()滚动条将要移动到x y 经过计算得出的值
window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));
    //如果 x (scrollLeft!=0)||y(scrollTop!=0)还未移动到顶部.所以setTimeout()继续执行该函数
    if(x > 0 || y > 0) {
           var invokeFunction = "goTop(" + acceleration + ", " + time + ")";
           window.setTimeout(invokeFunction, time);
      }
}
分享到:
评论

相关推荐

    固定div,滚动到顶部固定

    在网页设计中,"固定div,滚动到顶部固定"是一种常见的布局技巧,它可以使特定的div元素在页面滚动时始终保持在视口的可见位置,通常用于实现导航栏、侧边栏等元素的固定效果。这种效果可以提升用户体验,因为用户...

    JS控制滚动条自动向下滚动

    在JavaScript(JS)编程中,控制滚动条自动向下滚动是一种常见的需求,特别是在实时聊天、论坛或者日志更新等场景中,我们希望用户能够始终保持看到最新的内容。本篇将详细讲解如何利用JavaScript实现这一功能,以及...

    js页面滚动自动隐藏和显示顶部菜单.zip

    这个“js页面滚动自动隐藏和显示顶部菜单”的压缩包文件就提供了实现这一功能的JavaScript代码示例。 首先,我们要了解JavaScript(JS)在网页开发中的作用。JavaScript是一种客户端脚本语言,它允许开发者在用户...

    jQuery页面滚动顶部固定tab选项卡切换代码

    本项目涉及的知识点是“jQuery页面滚动顶部固定tab选项卡切换代码”,这是一个常见的用户体验增强功能,常用于新闻列表或长篇内容的页面,以帮助用户在页面滚动时仍能方便地访问导航。 首先,我们来看“tab选项卡...

    js 固定位置的层 不随滚动条滚动

    在网页设计中,"js 固定位置的层 不随滚动条滚动" 是一个常见的需求,主要用于实现诸如固定顶部导航、侧边栏或者底部客服窗口等元素。这些元素在用户滚动页面时始终保持在屏幕的特定位置,提升用户体验,让用户可以...

    JS实现部分HTML固定页面顶部随屏滚动效果

    本文实例讲述了JS实现部分HTML固定页面顶部随屏滚动效果。分享给大家供大家参考,具体如下: 我们经常在淘宝网看到这样的特效,商品列表特别长,而商品列名称始终保持在最顶端。如果你把滚动条滚动至最上边了,那么...

    javascript 实现滚动条滚动到一定距离时显示层

    javascript 实现滚动条滚动到一定距离时显示层 可以兼容全部浏览器。

    js滚动延时加载

    JavaScript滚动延时加载,也称为懒加载(Lazy Loading),是一种优化网页性能的技术。它主要应用于大量数据或图像的页面,通过只在用户滚动到可视区域时才加载相关内容,从而减少初次加载页面时的数据量,提高页面...

    简单JS随滚动条滚动导航

    【标题】"简单JS随滚动条滚动导航"所涉及的知识点主要集中在JavaScript的事件监听、DOM操作以及CSS样式实现上。这种类型的导航栏通常用于网页设计中,它能随着用户滚动页面而改变位置,始终保持在可见区域,为用户...

    向上滚动到浏览器顶部固定住,向下滚动出浏览器顶部回复原状

    标题 "向上滚动到浏览器顶部固定住,向下滚动出浏览器顶部回复原状" 描述的是一个常见的网页交互功能,通常称为“返回顶部”或“固定顶部导航”。这种功能在用户浏览长页面时尤其有用,它允许用户轻松地回到页面顶部...

    导航栏滚动到顶部后固定

    在实际项目中,开发者可能会结合JavaScript或者jQuery来实现更复杂的交互效果,比如在导航栏到达顶部前保持静态,一旦滚动超过一定距离才变为固定。此外,还可以添加过渡动画,使导航栏在切换状态时更加平滑。 综上...

    js滚动条美化

    本主题将探讨如何利用JavaScript(JS)和CSS来美化滚动条,使其与网站的整体设计更加协调,提升用户体验。 首先,我们需要了解CSS在滚动条美化中的作用。CSS3引入了`::-webkit-scrollbar`和`::-webkit-scrollbar-...

    iscroll分页滚动(加回到顶部)

    在Web开发中,iscroll是一个流行的JavaScript库,用于处理触摸设备上的滚动事件,提供高性能、平滑的滚动效果。iscroll不仅支持基本的滚动功能,还可以实现下拉刷新、上拉加载更多等增强交互体验的特性。在这个...

    js固定层不随滚动条滚动图片广告固定层在顶部

    在网页设计中,有时我们...总结来说,实现“js固定层不随滚动条滚动”的效果主要涉及JavaScript事件监听、CSS的`position`属性以及对滚动位置的计算。在实际应用中,应考虑兼容性和性能优化,以提供更好的用户体验。

    js滚动淡入浅出的效果

    在本主题中,“js滚动淡入浅出的效果”是指利用JavaScript技术实现的一种网页滚动时元素逐渐显现的视觉特效。这种效果通常通过调整元素的透明度或高度来实现,给用户带来平滑、自然的浏览体验。 1. **JavaScript...

    手机顶部滚动菜单

    总之,手机顶部滚动菜单是一种实用且高效的导航设计,通过巧妙地结合HTML、CSS和JavaScript(尤其是jQuery),我们可以实现功能丰富、响应式的滚动菜单,提升移动应用的可用性和用户体验。在开发过程中,不断关注...

    js Tab选项卡标签滑动带滚动条的内容滚动切换显示代码

    JavaScript(简称JS)是一种轻量级的脚本语言,常用于网页和网络应用开发,实现动态效果和交互。在这个特定的场景中,我们讨论的是如何使用JS实现Tab选项卡的滑动切换,同时带有滚动条的内容滚动功能。这种功能常见...

    js实现文字内容无缝滚动动画效果

    "js实现文字内容无缝滚动动画效果"是一个常见的JavaScript技术应用,主要用于创建一种视觉上连续、无中断的文字滚动展示,常见于新闻网站或者公告栏。这种效果使得有限的空间内可以展示更多的信息,而不会显得拥挤。...

    JS滚动效果,首页滚动显示

    在本主题中,"JS滚动效果,首页滚动显示"是指利用JavaScript技术实现网站首页内容随着用户滚动页面时动态显示的效果。这种效果可以提升用户体验,使得信息展示更加流畅且吸引注意力。 在首页滚动显示中,常见的应用...

    JS滚动字幕

    本文将深入解析如何利用JavaScript(简称JS)来创建滚动字幕,并结合给定的代码示例进行详细说明。 #### 原理概述 滚动字幕的基本原理是通过不断改变`<div>`元素的`scrollTop`属性,使内部内容看起来像是在上下...

Global site tag (gtag.js) - Google Analytics