我的思路就是判斷合適的時候將這個元素的position設為fixed,那麼這個合適的時機如何判斷呢?我們可以計算頁面滾動的距離。
在mounted
鉤子中加入以下**:
mounted() ,
離開頁面時要移除監聽,在destroyed
鉤子中移除監聽:
destroyed(),
// 監聽dom渲染完成
this.$nexttick(function());
handlescroll(),
得到乙個boolean值的headerfixed,然後就可以動態設定樣式了。
.isfixed
在dom中:
知識模組
知識點能力要求
vue監聽滾動事件 實現某元素吸頂或者固定位置顯示
1 監聽滾動事件 利用vue寫乙個在控制台列印當前的scrolltop,首先,在mounted鉤子中給window新增乙個滾動滾動監聽事件,mounted 然後在方法中,新增這個handlescroll方法 handlescroll 2 監聽元素到頂部的距離 並判斷滾動的距離如果大於了元素到頂部的距...
vue監聽滾動事件 實現某元素吸頂或者固定位置顯示
1 監聽滾動事件 利用vue寫乙個在控制台列印當前的scrolltop,首先,在mounted鉤子中給window新增乙個滾動滾動監聽事件,mounted function 然後在方法中,新增這個handlescroll方法 2 監聽元素到頂部的距離 並判斷滾動的距離如果大於了元素到頂部的距離時,設...
vue監聽滾動事件 實現某元素吸頂或者固定位置顯示
1 監聽滾動事件 利用vue寫乙個在控制台列印當前的scrolltop,首先,在mounted鉤子中給window新增乙個滾動滾動監聽事件,mounted 然後在方法中,新增這個handlescroll方法 handlescroll 控制台列印結果 2 監聽元素到頂部的距離 並判斷滾動的距離如果大於...