如何創建浮動內部鏈接容器

Question

我試圖創建一個內部跳線鏈接的頁面在同一頁面中跳轉到特定的錨標籤或標題標籤..

我想要的跳線連接到固定在頂部，它是由滾動，並與當它到達頁腳頁腳滾動..

，我想滾動到無刷新爲我點擊任何的快速鏈接的頁面的特定鏈接..

我也想突出顯示當前正在滾動的鏈接..

我試圖做到這一點，但這裏是我想出了..

function goToByScroll(hash) { 
$(document.body).animate({ 
    'scrollTop': $(hash).offset().top 
}, 500); 
    } 

var $links = $('#links'); 
var $content = $('#content'); 
height = $(window).height(); 

$(window).scroll(function(){ 

if ($(window).scrollTop() >= height){ 

    $links.css({ position:'fixed', top:'70px'}); 
    $content.css({ marginLeft: '80px'}); 

} else { 

    $links.css({ position:'relative'}); 
    $content.css({ marginLeft: '9px'}); 

} 

}); 

// http://jsfiddle.net/MfS3J/13/

基本上我想創建這樣的 galaxy s4 review - the verge

Answer 1

您可以使用jQuery航點插件http://imakewebthings.com/jquery-waypoints/

有了這個插件每當窗口的頂部（或底部）達到一定元素可以觸發一個事件。

E.G.

$('#id_of_container').waypoint(function(direction) { 
    if(direction=='down'){ 
    $(this).css('position','fixed'); 
    } else { 
    $(this).css('position',''); 
    } 
}); 

Answer 2

這是你想要的嗎？ http://jsfiddle.net/MfS3J/15/，你問了這麼多問題。
可以使用

<a href="#jump_1">header 1</a> 

跳

<a name="jump_1"></a> 

，而不是js函數