javascript - 如何做出pc網站隨鼠標滾動動態出現效果

問題描述

這是demo網址：http://demo.cssmoban.com/csst...隨鼠標滾珠滑動，網頁中的內容動態出現是怎么做到的

問題解答

可以使用一些第三方開發庫如 wow.js，也可以自己造

根據右側滾動條, 當到達指定的位置時, 就顯示出來并執行對應的動態效果代碼.

監聽滾動高度，加Css3樣式

這個只是加了一個滾動監聽。滾動到相應的位置讓對應位置的opacity從0變為1，還有一些其他的css屬性，這些樣式都添加了動畫的效果。

就是要添加一個監聽滾動事件，根本監聽到的結果來判斷要不要異步獲取或者把已有但沒有顯示的部分，添加或者顯示出現

//鼠標滾動事件$(window).scroll(function(){

//獲取當前滾動條距離頂部的高度var scrollTop = $(this).scrollTop(); //定義你動畫動畫應該在滾動條在哪個高度以上顯示 假設200px；if(scrollTop>200){ //你的動畫效果函數}

}