浮動式固定選單 ( 用於 Google Blogger 平台 ) | 瑪吉和妹妹球 ( 原名: 超時空寵愛)

 網站部落格浮動式固定選單 ( 用於 Google Blogger 平台 )

如果你的網站或是部落格是建立在 Google Blogger 平台原始樣板的選單不是浮動式的。 所以當你的網頁向下瀏覽後, 如果要用選單功能就要將游標往上移到頂端, 才能使用選單功能, 所以要花一兩秒時間。

若是你有浮動式固定選單, 即使你往下瀏覽網頁很下面, 選單依舊在你的螢幕上面, 毋須捲動畫面, 是不是很方便呢? 即使你不懂程式語言, 只要照抄下面的程式碼, 就可以達成, 可以把它放在最下面</body>結束標籤的上方統一管理，免得之後要找不知道放到哪但是有一個地方需要改變, 就是你要找到"選單"在程式裡面的名稱, 另外就是導覽選單跟螢幕上方的距離需要調整, 不能完全依照程式碼的數字, 這個多測試幾個數字就可以解決。

<script type="text/javascript"> $(function() { $(window).scroll(function() { if ($(this).scrollTop() > 495) { /* 要滑動到選單的距離 */ $('.dropdowns').addClass('navFixed'); /* 幫選單加上固定效果 */ } else { $('.dropdowns').removeClass('navFixed'); /* 移除選單固定效果 */ } }); }); </script>

這個程式碼是摘錄自這個網址 https://edwardzou.blogspot.com/2017/09/fixMenu.html

詳細的解說可參考這個網址, 我的網站浮動式固定選單就是參考這篇文章