aos.js让页面滚动变得丰富
(转)
<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="js/highlight.min.js"></script>
<script src="dist/aos.js"></script>
<script>
AOS.init({
easing: 'ease-out-back',
duration: 1000
});
</script>
<script>
hljs.initHighlightingOnLoad(); $('.hero__scroll').on('click', function(e) {
$('html, body').animate({
scrollTop: $(window).height()
}, 1200);
});
</script> 浏览网址:http://www.lanrenzhijia.com/demos/41/4139/demo/
下载:链接: https://pan.baidu.com/s/1dEOf6Op 密码: mv2e
aos.js让页面滚动变得丰富的更多相关文章
- WOW.js – 在页面滚动时展现动感的元素动画效果
在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感.WOW.js 就是一款帮助你实现这种 CSS 动画效果的插件,很容易定制,你可以改变动画设置喜欢的风格.延迟.长度.偏移和迭代等 ...
- WOW.js – 让页面滚动更有趣
演示1 演示2-仿oppo首页 下载 简介 有的页面在向下滚动的时候,有些元素会产生细小的动画效果.虽然动画比较小,但却能吸引你的注意.比如刚刚发布的 iPhone 6 的页面(查看).如果你希望你的 ...
- js让页面逐渐变透明,直到消失
在gitHub闲逛的时候,无意间发现了些好玩的代码,一个歪果仁写的,这里我做了些修改和优化,gitHub链接已经忘了,是一段恶搞的js代码,假如你的顾客或者老板拖欠你工资,那你就可以让项目页面在浏览器 ...
- 原生js禁止页面滚动
// 开启.禁止页面滚动 bodyScroll: { e(e) { e.preventDefault();// 注意此处代码片段必须这样提出来已保证传入下边两个事件的处理程序一样才生效,分别写到事件处 ...
- [HTML/JS] JQuery 页面滚动回到顶部
HTML: <html> <body> <div id="back-to-top" style="cursor:pointer; displ ...
- WOW.js – 让页面滚动更有趣
官网:http://mynameismatthieu.com/WOW/ 建议去官网一看 下载地址:https://github.com/matthieua/WOW 浏览器兼容 IE10+ Chrom ...
- js禁止页面滚动
开发移动端页面的时候有一个很比较常见的需求,在出现弹窗时,禁止滑动弹窗后面的主体页面.如何实现呢,往下看 js实现整个页面禁止滚动: document.body.addEventListener('t ...
- WOW.js——在页面滚动时展现动感的元素动画效果
插件描述:WOW.js 是一款可以实现滚动页面时触发CSS 动画效果的插件,动态效果可以使网站显示更有动感. 当页面在向下滚动的时候,使用WOW.js可以让页面元素产生细小的动画效果,从而引起浏览者注 ...
- [js常用]页面滚动的顶部,指定位置或底部,平滑滚动
js平滑滚动到顶部.底部.指定地方 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
随机推荐
- LeetCode - 136. Single Number - ( C++ ) - 解题报告 - 位运算思路 xor
1.题目大意 Given an array of integers, every element appears twice except for one. Find that single one. ...
- Hadoop源码解析 1 --- Hadoop工程包架构解析
1 Hadoop中各工程包依赖简述 Google的核心竞争技术是它的计算平台.Google的大牛们用了下面5篇文章,介绍了它们的计算设施. GoogleCluster: http:// ...
- HDU 1569 方格取数(2)(最大流最小割の最大权独立集)
Description 给你一个m*n的格子的棋盘,每个格子里面有一个非负数. 从中取出若干个数,使得任意的两个数所在的格子没有公共边,就是说所取数所在的2个格子不能相邻,并且取出的数的和最大. ...
- es6从零学习(五):Module的语法
es6从零学习(五):Module的语法 ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量 一:es6模块化和 CommonJS 和 AMD 模块 (运行 ...
- Repair the Wall (贪心)
Long time ago , Kitty lived in a small village. The air was fresh and the scenery was very beautiful ...
- c# 两个软件传参
1.socket 传参,类似于小型的服务器和客户端,一端发送,另一端保持监听状态. 2.通过第三方 数据库或者文件.
- Java语法基础课后作业
1.动手动脑 运行它EnumTest.java,分析运行结果 s和t分别引用的是SMALL和LARGE,枚举类型不是原始数据类型,s和u的赋值方式不同,但结果一样,列出它的所有值:SMALL,MEDI ...
- 如果jsp表单元素的值为空,如何避免null出现在页面上?
可以写一个简单的函数对空值进行处理,判断值是否为空,如果是空就返回空字符串.实例代码如下: <%! String blanknull(String s) { return (s == null) ...
- 软工实践Alpha冲刺(1/10)
队名:我头发呢队 组长博客 作业博客 张杰(组长) 过去两天完成了哪些任务 查阅Python爬取音源的资料,如 Python3爬虫抓取网易云音乐热评实战 Python爬取高品质QQ音乐(2) 如何爬网 ...
- TCP系列21—重传—11、TLP
一.介绍 Tail Loss Probe (TLP)是同样是一个发送端算法,主要目的是使用快速重传取代RTO超时重传来处理尾包丢失场景.在一些WEB业务中,如果TCP尾包丢失,如果依靠RTO超时进行重 ...