文件名称：Parallax_Scrolling_demo
文件大小：1.48MB
文件格式：ZIP
更新时间：2024-06-18 08:28:34
JavaScript
###parallax scorlling demo 一个视差滚动的简单demo,主要利用了css的clip属性。 /*例如*/ clip: rect(-1714px auto -909px 0px); ###clip属性 描述：剪切元素，剪切顺序为顺时针（上，右，下，左）; 右为auto可以理解为100%，左边为0，例子中右边和左边不发生剪切。 ###demo提取的算法 clip里的top值为: div自身的Top位置－文字自身的位置top－页面的scrollTop clip里的bottom值为:div自身的高+(div自身的Top位置－文字自身的位置top)-页面的scrollTop ###例子描述 当页面出发scroll事件时，页面整体向上移动，滚动条向下移动， clip top值减小，达到第二张背景图位置时，第二张图上的文字被显示出来。 同时clip bottom减小 当第三张图出
【文件预览】：
Parallax_Scrolling_demo-master
----index.html(2KB)
----img()
--------.DS_Store(6KB)
--------2.jpg(347KB)
--------1.jpg(789KB)
--------3.jpg(439KB)
----parallax.scroll.js(1KB)
----jquery.min.js(81KB)
----README.md(1KB)
----parallax.js(2KB)