通過使用ScrollMe插件,可以將靜態(tài)的頁面添加動態(tài)的效果,讓頁面整體動感起來,ScrollMe插件使用非常的簡單,只需要在元素中添加屬性即可。
	Github地址:https://github.com/nckprsn/scrollme
	引入核心文件:
	<script src='js/jquery.scrollme.js'></script>
	在html結構中添加屬性,示例代碼如下:
	<div class="scrollme">
	    <div
	        class="animateme"
	        data-when="enter"
	        data-from="0.5"
	        data-to="0"
	        data-opacity="0"
	        data-translatex="-200"
	        data-rotatez="90"
	    >
	        Yup, that's all.
	    </div>
	</div>
	Options選項參數(shù)如下:
	when
	決定滾動的邊界開始和結束,有三個參數(shù):
	enter:從容器的頂部進入視窗時退出
	exit:從容器的底部進入視窗時退出
	span:從容器的頂部進入視窗到底部進行視窗
	from & to
	指定滾動邊界內(nèi)動畫的起始位置與結束位置,值為: 0 - 1
	easing
	設置動畫的形式
	"easeout": 緩沖淡出.
	"easein": 緩沖淡入.
	"easeinout": 淡出.
	"linear": 無動畫.
	crop
	是否限制滾動邊界在文檔邊界內(nèi)。值:true 和false
	opacity
	元素的透明度,值:0 - 1
	scale, scalex, scaley & scalez
	指定元素的坐標x,y,z的數(shù)值實現(xiàn)滾動動畫效果
	rotatex, rotatey & rotatez
	指定元素在X,Y和Z軸的角度旋轉(zhuǎn)數(shù)值。
	translatex, translatey & translatez
	指定的距離把動畫元素沿X、Y和Z軸數(shù)值
                    


 鄂公網(wǎng)安備 42090202000212號
鄂公網(wǎng)安備 42090202000212號