一、效果Demo先行~
視差滾動效果大家可能都聽過，基本上都是JS實現的，有對應插件 - Parallax.js .
實際上，如果你對兼容性要求不是很高，比方說忽略IE瀏覽器，則我們使用簡單的幾行CSS代碼就可以實現視差滾動效果了。
對于效果展示，先看效果是最能引起興趣，激發學習熱情的，如下(IE9+)：
進入Demo滾動滾動條，最好鼠標慢慢拖動，效果更明顯——表情花朵等小圖標在手機圖片上方飛動的視差感覺。目前，Chrome以及FireFox等瀏覽器(不包括IE11在內的瀏覽器)都是有效果。
二、CSS實現的原理
原理說透了很簡單，下面幾個關鍵CSS聲明起的作用(紅色高亮部分)：
復制代碼
學習交流
- 綠毒越獄軟件 完美越獄4.21教程12-21
- htcg15怎么刷機？htcg15刷機教程12-21
- HTC hd7刷安卓2.2全教程12-21
- mpkg軟件下載和卸載的方法12-21
- 網站后臺系統設置的網站地址格式寫法07-09
- 防止重復提交js按鈕變灰07-09
- 不同時間顯示不同的廣告代碼07-09
- iframe框架調用高度自適應方法07-09
- 備份數據庫出現問題的解決方法07-09
熱門圖片
猜你喜歡的新聞
