博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
用 Stellar.js 制作视差滚动效果
阅读量:5752 次
发布时间:2019-06-18

本文共 527 字,大约阅读时间需要 1 分钟。

参考
 这个更有用
html
单个元素选项中
data-stellar-background-ratio比较常用。 接受一个正整数的值,可以改变它被应用到元素的影响速度。 例如,
data-stellar-background-ratio="0.5"意味着改变速度为自然滚动速度的一半。 如果想使这个属性值低于1,建议在样式表里设置
background-attachment: fixed;
<divclass="content"id="content3" data-stellar-background-ratio="0.5"></div>
css
background-attachment: fixed;
height:(比实际图片高度要小 才有视差)
js,引入jQuery和stellar就可以应用stellar
 
启动效应。设置一些常用选项(这些也可以不写,因为有时写上反而不能用。做好css和引入好js即可)
$.stellar({    horizontalScrolling: false,    responsive: true});

 

转载于:https://www.cnblogs.com/zyjzz/p/6973496.html

你可能感兴趣的文章
使用@media实现IE hack的方法
查看>>
《11招玩转网络安全》之第一招:Docker For Docker
查看>>
hive_0.11中文用户手册
查看>>
hiveserver2修改线程数
查看>>
XML教程
查看>>
oracle体系结构
查看>>
Microsoft Exchange Server 2010与Office 365混合部署升级到Exchange Server 2016混合部署汇总...
查看>>
Proxy服务器配置_Squid
查看>>
开启“无线网络”,提示:请启动windows零配置wzc服务
查看>>
【SDN】Openflow协议中对LLDP算法的理解--如何判断非OF区域的存在
查看>>
纯DIV+CSS简单实现Tab选项卡左右切换效果
查看>>
栈(一)
查看>>
ios 自定义delegate(一)
查看>>
创建美国地区的appleId
查看>>
例题10-2 UVa12169 Disgruntled Judge(拓展欧几里德)
查看>>
JS 原生ajax写法
查看>>
Composer管理PHP依赖关系
查看>>
React.js学习笔记之JSX解读
查看>>
我所了解的Libevent和SEDA架构
查看>>
Socket编程问题小记
查看>>