IE 瀏覽器頁面滾動條固定底部？Java 後端其實無關，純前端 JS 解決

許多開發者遇到「想讓結果表格的滾動條固定在螢幕底部，往上捲動時隱藏」的需求，並誤以為需在 Java 後端處理。實際上這完全是客戶端行為，只需幾行 JavaScript 即可實現。

核心思路

1. 建立一個 <div> 容器，套用 position: fixed; bottom: 0; 固定於視窗底部。
2. 監聽 scroll 事件，判斷 document.documentElement.scrollTop 或 document.body.scrollTop 是否為 0。
3. 當捲動至頂部時，將該容器 display 設為 none 隱藏；否則顯示。

實作代碼範例

<div id="fixedScrollBar" style="position: fixed; bottom: 0; width: 100%; background: #f5f5f5; display: none;">
  <!-- 這裡放置自訂滾動條或提示元素 -->
</div>

<script>
window.addEventListener('scroll', function() {
  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  var el = document.getElementById('fixedScrollBar');
  el.style.display = scrollTop === 0 ? 'none' : 'block';
});
</script>

關鍵點補充

• 相容性：IE 需同時檢查 documentElement 與 body 的 scrollTop，取非零值。
• 效能優化：滾動事件觸發頻率極高，建議加上 requestAnimationFrame 或防抖（debounce）處理。
• 與 Java 無關：後端只負責輸出資料與模板，捲動行為完全由瀏覽器渲染引擎決定。

結語

不要被「後台是 Java」誤導，滾動條定位與顯隱屬於前端視覺邏輯，用 CSS 定位 + JS 事件監聽即可輕鬆搞定。若專案使用 jQuery，也可用 $(window).scrollTop() 簡化判斷。