我想為網(wǎng)站創(chuàng)建一個粘性標題欄,就像本網(wǎng)站 (http://www.fizzysoftware.com/) 上的粘性標題一樣,如果有任何可以幫助我進行編碼或任何可以幫助我的資源創(chuàng)建相同的。您的回復(fù)將對我有很大幫助。
如果你想讓它在向下滾動到某個點時保持粘性,那么你可以使用這個函數(shù):
$window = $(window); $window.scroll(function() { $scroll_position = $window.scrollTop(); if ($scroll_position > 300) { // if body is scrolled down by 300 pixels $('.your-header').addClass('sticky'); // to get rid of jerk header_height = $('.your-header').innerHeight(); $('body').css('padding-top' , header_height); } else { $('body').css('padding-top' , '0'); $('.your-header').removeClass('sticky'); } });
和粘性類:
.sticky { position: fixed; z-index: 9999; width: 100%; }
您可以使用這個插件,它有一些有用的選項
在 CSS 中添加
position: fixed;
到你的標題元素。真的就是這么簡單。 下次,嘗試右鍵單擊您在網(wǎng)站上看到的內(nèi)容并選擇“檢查元素”。我認為現(xiàn)在每個現(xiàn)代瀏覽器都有它。非常有用的功能。