vue頭部保持不動,尾部一直在最底部

2021-10-10 13:00:54 字數 507 閱讀 7608

想頭部保持不動,當滾動條下拉到一定高度的時候,頭部固定不動;當滾動條下拉小於一定高度的時候,頭部恢復到正常的文件流裡。

尾部一直在內容的最後面:當內容沒有一屏的時候,尾部在最底部;當內容多的時候,尾部在內容的最後面。

(這裡c-header和c-footer為自定義header和footer元件,給g-view-container加乙個 ref 屬性 為了下一步的呼叫$refs來獲取它的距離上方的高度)

data();

},mounted () ,

methods:

}

.g-header-container.fixed

& ~ .g-footer-container

}.g-footer-container

(~)後續兄弟選擇器: 選擇所有符合條件的兄弟元素

這樣就達到了想要的效果! o(∩_∩)o哈哈~

一直在流浪

人生是一場旅途,我們一直在流浪。沿途的美景轉瞬即逝,唯有往事如影隨行。總在平衡,追蹤夢裡的畫面,現實還是幻覺,誰又能察覺?迷一樣的歲月,在旅途中丟失方向。茫然若失的不知所措,驚慌失措的無計可施。揮一揮拳頭,砸向深邃的夜空,迷茫的心境。總是努力不敢如此窘迫,而事實卻總是出乎意料的背道而馳,難道命硬的人...

雜談 學習一直在路上

部落格已經有一段時間沒有更新。江湖依舊在,心態有些懈怠,需要收拾心情,我要好好看風景。工作近來相對輕鬆,也就有了更多學習的時間。雖然部落格停更了一段時間,但是在我自己的mediawiki上仍在耕耘,只是大多是付費課程的筆記,放在網上就不厚道,不亦樂乎之後,部落格也就暫時放下。推薦一下極客時間,都是一...

設計模式 一直在更

一 單例模式 參考部落格 單例模式指的是 由該類來產生該類的物件,且確保只有單個物件被建立!懶漢式 多執行緒不安全 classa private static a instance public static a getinstance 改進懶漢式 多執行緒安全 單執行緒高效 classc priv...