在標題移回頁首

後保留文本我有一個粘性標題，在用戶滾動一點之後出現一個按鈕。當您單擊該按鈕時，標題會移回到頁面頂部，但文本向下移動。點擊按鈕後，如何保留文字。在標題移回頁首

另外，如何確保文本在標題移回頂端後不會使文本和標題之間的頁邊距增加一倍。它有點難以解釋，但你可以親眼看到。我試圖使用<br>，但這不起作用。

var closed = false; 

$(document).scroll(function() { 
    var y = $(this).scrollTop(); 
    if (y > 55 && !closed) { 
     $('.bottomMenu').fadeIn(); 
    } else { 
     $('.bottomMenu').fadeOut(); 
    } 

}); 
$("div.bottomMenu").on('click', function(){ 
    $('#header').css('position','static'); 
    $('div.bottomMenu').hide(); 
    closed = true; 
});

Example fiddle

來源

2014-01-07 Jacob

聽起來象是我的網站做與其導航。如果http://www.matutter.com的側邊導航欄正在做你想要的東西，請參閱https://github.com/matutter/matutterdotcom/blob/master/index.html – MatUtter

它正在移動文本，因爲你將'＃header'元素從'fixed'設置爲'static'。因此，您將頭元素放回到文檔的流程中。這會導致文檔的高度增加。您可以通過標題元素的高度來偏移頁面滾動。 – crush

不要改變position到static使用absolute，以保持頭跳出流程：

$('#header').css('position','absolute');

演示http://jsfiddle.net/ZyKar/709/

來源

2014-01-07 17:10:18 DaniP

很好，謝謝。這是一個簡單的改變，我喜歡它。 – Jacob

我其實通過了這個，因爲從雅各布的例子中不清楚這是他想要的行爲。如果這符合你的標準，[不要忘了設置'正確'和'左'，以避免得到一個討厭的水平滾動條]（http://jsfiddle.net/ZyKar/711/）。 – crush

好點@crush滾動是由身體標記的100％寬度和邊距生成的。重新設置邊距也可以工作，看起來更好http://jsfiddle.net/ZyKar/712/ – DaniP

在標題移回頁首

回答

相關問題