x=x-20; 设置回到每10s的速度,

function gotoTop()
{
var x=document.body.scrollTop||document.documentElement.scrollTop;
var timer = setInterval(function()
{
x=x-20;
if(x<20)
{
x=0;
window.scrollTo(x,x);
clearInterval(timer);
}
window.scrollTo(x,x);
},10);

}

锚点设置:

$(".item").on('click',function(){

if($('#' + $(this).attr("name")).offset() != undefined)
{
$("html, body").animate({
scrollTop: $('#' + $(this).attr("name")).offset().top + "px"
}, {
duration: 500,
easing: "swing"
});

return false;
}
});

点击dom设置id或者name属性即可 此处使用的是name

js回到顶部 动画速度 (自己记录)的更多相关文章

  1. js回到顶部------转载

    [1]锚点 使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 [注意] ...

  2. 详解原生JS回到顶部

    第一次知道可以用超链接(锚点)实现回到顶部的时候我是很震惊的,想着原来可以这么简单啊!但是作为一个正在学习JS的小白,不能就这么轻易止步,所以查资料自己整了一个JS返回顶部. HTML代码: ? 1 ...

  3. javascript 回到顶部 动画效果

    上代码: <!DOCTYPE html> <html> <head> <meta content="测试demo" name=" ...

  4. js回到顶部

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 原生js回到顶部

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. JS回到顶部代码小记

    HTML: <div id="goTop"> <a href="#top"><img src="~/Content/th ...

  7. css+js回到顶部

    .backToTop { display: none; width: 18px; line-height: 1.2; padding: 5px 0; background-color: #000; c ...

  8. JS 回到顶部

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 通过js实现回到顶部功能

    许多商城网址,当我们滚动到一定高度时,我们会发现一般会出现一个回到顶部的js选项,点击轻松实现回到顶部,交互效果会显得比较人性化,且回到顶部过程中若在滚动滚动条时可以停止滚动,现在让我们来实现吧 我总 ...

随机推荐

  1. git爬坑不完全指北(二):failed to push some refs to ‘XXX’的解决方案

    报错分析        从字面理解,这个报错的意思就是说远程仓库里有一个改动是本地仓库里没有的,所以在push前要先把远程仓库上的改动pull或者fetch到本地仓库.然后再执行push的操作,把本地 ...

  2. [2009国家集训队]小Z的袜子(hose) 浅谈莫队

    浅谈莫队 推荐学习博客 http://foreseeable97.logdown.com/posts/158522-233333 借用题目: bzoj 2038 2009 国家集训队 小Z的袜子htt ...

  3. 网络编程之python zeromq学习系列之一

    简介: zeromq中间件,他是一个轻量级的消息中间件,传说是世界上最快的消息中间件,为什么这么说呢? 因为一般的消息中间件都需要启动消息服务器,但是zeromq这厮尽然没有消息服务器,他压根没有消息 ...

  4. supervisor简洁用例

    supervisor是什么 superviosr是一个Linux/Unix系统上进程监控和管理的工具,它由python编写,可以用pip安装.supervisor能将一个普通的命令行进程变为后台dae ...

  5. Django rest framwork

    Restful API REST与技术无关,代表的是一种软件架构风格,REST是Representational State Transfer的简称,中文翻译为“表征状态转移” REST从资源的角度类 ...

  6. jquery ajax complete 方法

    jquery ajax var ajaxTimeoutTest = $.ajax({ url:'',  //请求的URL timeout : 1000, //超时时间设置,单位毫秒 type : 'g ...

  7. connect by和strart with子句

    --使用connect by和strart with子句 SELECT [level],column,expression, ... FROM table [WHERE where_clause] [ ...

  8. 从一份配置清单详解 Nginx 服务器配置

      概述 在前面< Nginx 服务器开箱体验> 一文中我们从开箱到体验,感受了一下 Nginx 服务器的魅力.Nginx 是轻量级的高性能 Web 服务器,提供了诸如 HTTP 代理和反 ...

  9. 【前端vue开发】vue项目使用sass less扩展语言所要安装的依赖

    1.创建一个基于 webpack 模板的新项目 $ vue init webpack myvue 2.在当前目录下,安装依赖 $ cd myvue $ npm install 3.安装sass的依赖包 ...

  10. 树莓派指定静态IP

    1.备份并清空 interfaces 文件 cp /etc/network/interfaces /etc/network/interfaces.bak vi /etc/network/interfa ...