Tạo thanh điều hướng hấp dẫn bằng cách sử dụng trình khởi động twitter?

Question

Tôi đang cố gắng giới thiệu một thanh điều hướng, khi không còn trong chế độ xem, sau đó sẽ sử dụng vị trí tiêu đề cố định. Tôi bắt đầu bằng cách sử dụng chủ đề này: Replicating Bootstraps main nav and subnav.

Kể từ đó, tôi đã đến: http://jsfiddle.net/yTqSc/2/.

Vấn đề:

Các liên kết anchor sẽ vọt lố mục tiêu của họ (trong đó ẩn tiêu đề đích) bất cứ khi nào navbar là trong gốc vị trí của nó, nhưng không phải khi nó được cố định. Tôi có thể sửa chữa các overshoot (tôi gọi http://nicolasgallagher.com/jump-links-and-viewport-positioning/demo/), nhưng sau đó tôi kết thúc với một khoảng cách quá mức bằng cách sử dụng các liên kết khi navbar được cố định.

Có ai có thể tư vấn cách lấy kết quả nhất quán bất kể thanh điều hướng có được cố định hay không?

Cảm ơn.

Answer 1

là những gì bạn đang tìm kiếm?

<div class="navbar navbar-fixed-top"> 

Answer 2

Bạn không có CSS ​​cho thanh điều hướng cố định. Ngoài ra, bạn cần xử lý khi bạn cuộn lùi lên.

Xem bản demo http://jsfiddle.net/yTqSc/39/

Javascript

$(document).scroll(function(){ 
var elem = $('.subnav'); 
if (!elem.attr('data-top')) { 
    if (elem.hasClass('navbar-fixed-top')) 
     return; 
    var offset = elem.offset() 
    elem.attr('data-top', offset.top); 
} 
if (elem.attr('data-top') <= $(this).scrollTop()) 
    elem.addClass('navbar-fixed-top'); 
else 
    elem.removeClass('navbar-fixed-top'); 
}); 

CSS

.subnav { 
    background:#FFF; 
} 
.navbar-fixed-top { 
    position:fixed; 
} 

Hoặc sử dụng Waypoints jquery plugin để xử lý các yếu tố dính.

Answer 3

nó là tốt đẹp, nhưng tôi đã nhận điên để thực hiện nav dính ở phía dưới thay vì đầu, như thế này: http://golkhaneh.tv3.ir/

thế nào có thể làm điều đó?