我們經常可以看到這樣的頁面，頁面的主體部分採用左右佈局，靠左的爲導航，靠右的爲頁面主要內容。如下圖：
而當左邊的導航高度不夠、而右邊的內容很多時，頁面往下拉會發現左邊出現了一大塊空白，導致主體內容顯得窄小且頁面整體不對稱，如下圖：
解決的辦法之一是在窗口滾動時，左邊的區域也跟着一起移動，這不但解決了上述問題，也一定程度上地增強了用戶體驗，因爲此時用戶能夠隨時地導航到其他頁面而不需要回到頁面頂部。這一效果已經在很多網站採用了，比如淘寶社區：
當然實現這種效果的方法有很多，這裏給出一種比較簡單的，代碼如下。首先左邊的區域採用相對定位，初始的top值爲0，接下來記錄下左邊區域的初始位置(這裏爲t)，然後當窗口滾動時改變這個top值，爲了避免在頁面頂部時左邊的區域覆蓋導航，這裏分兩種情況：當滾動值scrollTop大於t時，把top值設置爲窗口滾動的高度，則左邊的區域貼在最頂端；否則還原爲初始的位置值t。
同樣的道理，如果要固定頂部導航也是可以做到的。