今天发现JQuery可以用 animate方法回到顶部,心想着zepto应该也可以

$('html,body').animate({ scrollTop: 0 }, 1000);

于是便用了一下,发现console提示zepto没有这个方法,百度之后发现原来不是没有这个方法,是因为这animate这个方法是在effects组件里的,然而默认的zepto是没有这个组件的,于是又倒腾了一下。

1.要安装node和npm

2.到https://github.com/madrobby/zepto下载zepto的包

3.到zepto的目录下编辑目录下的make文件,找到第41/42行,就是modules = (env['MODULES'] || 'zepto event ajax form ie').split(' ')这么一行,增加或删除组件

4.到cmd,cd到zepto的目录,执行npm install回车,再执行npm run-script dist 回车,成功之后你应该可以看到

dist/zepto.js: 57.4 KiB
dist/zepto.min.js: 25.8 KiB
dist/zepto.min.gz: 9.6 KiB

接下来你就可以快乐地使用animate了,什么?不行,在踩了一个又一个坑之后,发现又来一个坑。zepto的animate()源码采用css3的方式进行,而scrollTop属性不在css3的动画属性中,所以没有生效。

解决方案见这篇博文http://www.cnblogs.com/skyHF/p/4720308.html

zepto 添加 animate组件的更多相关文章

  1. Ext.js添加子组件

    Ext框架提供了很多api,对于不熟悉的人来说,api的释义有时不够明了.最近碰到了添加子组件的需求,特记录下来. 1. 例如,有一个窗体组件: 现在要为其添加一个字段“学校分类”,变成如下所示: 示 ...

  2. JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里

    JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里 <!doctype html> <html manifest="lab4.manifest&q ...

  3. Angular02 将数据添加到组件中

    准备:已经搭建好angular-cli环境.知道如何创建组件 一.将一个数据添加到组件中 1 创建一个新的组件 user-item 2 将组件添加到静态模板中 3 为组件添加属性,并利用构造器赋值 4 ...

  4. springboot添加swagger2组件

    swagger2是一个可以构建和调试RESTful API文档的组件,利用swagger2的注解可以快速的在项目中构建Api文档,并且提供了测试API的功能 1,引入依赖 <dependency ...

  5. Ext JS添加子组件的误区

    经常会有人问我,为什么我的Grid不能岁窗口的变得而自动调整.了解后,发现很多人都习惯在渲染子组件的时候将Gird渲染到容器内的一个div里,而这正是问题的所在. 在Ext JS的布局系统中,能控制到 ...

  6. python测试开发django-45.xadmin添加小组件报错解决

    前言 xadmin首页上有个添加小组件按钮,打开的时候会报错"render() got an unexpected keyword argument 'renderer'" 环境: ...

  7. 雷林鹏分享:jQuery EasyUI 数据网格 - 添加分页组件

    jQuery EasyUI 数据网格 - 添加分页组件 本实例演示如何从服务器端加载数据,如何添加分页组件(pagination)到数据网格(datagrid). 创建数据网格(DataGrid) 为 ...

  8. Ext如何动态添加一行组件

    用的column布局,点击一个按钮能添加一行组件,如文本框,有下拉框等. 如: 效果: 实现方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 ...

  9. Angular03 将数据添加到组件中

    准备:已经搭建好angular-cli环境.知道如何创建组件 一.将一个数据添加到组件中 1 创建一个新的组件 user-item 2 将组件添加到静态模板中 3 为组件添加属性,并利用构造器赋值 4 ...

随机推荐

  1. AWR报告分析

    AWR报告分析 awr报告是oracle 10g下提供的一种性能收集和分析工具,它能提供一个时间段内整个系统资源使用情况的报告,通过这个报告,我们就可以了解一个系统的整个运行情况,这就像一个人全面的体 ...

  2. flink Window的Timestamps/Watermarks和allowedLateness的区别

    Watermartks是通过additional的时间戳来控制窗口激活的时间,allowedLateness来控制窗口的销毁时间.   注: 因为此特性包括官方文档在1.3-1.5版本均未做改变,所以 ...

  3. 部分用户间接性访问不了linux服务器解决方法

    linux的/etc/sysctl.conf中应设置 net.ipv4.tcp_tw_reuse = net.ipv4.tcp_tw_recycle = 参考文章: https://ieevee.co ...

  4. goldengate简单配置

    goldendate配置单项同步 源数据库    extract抽取进程 trail文件 复制进程 目标进程 由于最开始配置goldengate的时候,没有弄清除原理,导致出错了都不知道怎么解决. 最 ...

  5. pycharm多行注释

    选中需要注释的代码 ctrl+/ #首字母大写# test = 'alex'# v = test.capitalize()# print (v)## 字符串的加法# n1 = 'my '# n2 = ...

  6. js中改变this指向的call、apply、bind 方法使用

    前言: 由于js 中this的指向受函数运行环境的影响,指向经常改变,使得开发变得困难和模糊,所以在封装sdk,写一些复杂函数的时候经常会用到this 指向绑定,以避免出现不必要的问题,call.ap ...

  7. Java---Huffman树的实现

    什么是哈弗曼树 1.哈弗曼树是最优二叉树,树的带权路径长度最小的一个二叉树. 2.带权路径长度为根节点到该节点的路径长度和该节点权重的乘积.3.路径长度为当前节点到另一个节点所经过的分支的个数(边的个 ...

  8. Google Cloud Platform 续

    Google Cloud Platform 创建新实例 地区:australia-southeast1-a 机器类型:1个vCPU n1-standard-1 系统:Ubuntu 16.04 LTS ...

  9. macOS安装MongoDB

    先在macOS里安装一个很好的插件 1.百度搜索homebrew 或 直接进入https://brew.sh 2.复制网页下面的命令符 /usr/bin/ruby -e "$(curl -f ...

  10. PHP几种常见魔术方法与魔术变量解析

    原文地址:http://small.aiweimeng.top/index.php/archives/49.html 先不多说,直接上代码,如下: class Demo { private $str ...