2012-06-14 38 views
13

Tôi đã tạo thanh điều hướng ở trên cùng với 5 liên kết. Tại trang tôi đã thêm 5 phần có id theo tên sau thẻ # trong phần tử. Vấn đề là nút liên kết điều hướng cuối cùng được đánh dấu (lớp 'hoạt động' đã được thêm vào nó trong thời gian chạy ngay từ đầu mặc dù trong chính mã đó thanh điều hướng đầu tiên được đặt thành "hoạt động". Tôi có phiên bản khởi động mới nhất là v2.0.4 Điều gì là sai?bootstrap scrollspy đánh dấu nút liên kết điều hướng cuối cùng sau khi tải

<div class="navbar" id="MenuBar"> 
    <div class="topHeadContentLogo"></div> 
    <ul class="nav nav-pills" id="MenuUl"> 
     <li class="active"><a href="#Weekly">Weekly</a></li> 
     <li class=""><a href="#Post">Post</a></li> 
     <li class=""><a href="#Audience">Audience</a></li> 
     <li><a href="#Website">Website</a></li> 
     <li><a href="#FAQ">FAQ</a></li> 
    </ul> 
</div> 

<div id="contentDiv"> 
    <section id="Weekly"> 
     <h1>weekly</h1> 
    </section> 

    <section id="Post"> 
     <h1>Post</h1> 
    </section> 

    <section id="Audience"> 
     <h1>Audience</h1> 
    </section> 

    <section id="Website"> 
     <h1>Website</h1> 
    </section> 

    <section id="FAQ"> 
     <h1>FAQ</h1> 
    </section> 
</div> 



$('#MenuBar').scrollspy(); after document ready 
+0

đăng mã html của nav và js để gọi scrollspy()? – Luca

+0

@luca, đã chỉnh sửa. Tôi đang làm gì sai? – Alon

+3

Lạ, tôi đang gặp vấn đề tương tự với attr dữ liệu được thêm vào thẻ body. Bất kỳ giải pháp cho điều này? – davebowker

Trả lời

3

có bạn thêm data-spy="scroll" đến <body> thẻ (hoặc bất kỳ thẻ khác có liên quan)?

+0

Có, tôi đã thêm thẻ đó, nhưng phần tử cuối cùng vẫn đang được kích hoạt khi tải – Alon

+2

bạn đã thử thêm đủ nội dung vào các phần khác nhau sao cho chúng không xuất hiện trong cửa sổ trình duyệt cùng một lúc? Tôi đã thử mã của bạn trong một trang bootstrap tôi đã xây dựng và nó có vẻ là tất cả ok. Tôi vừa thêm nhiều văn bản vào các phần để đảm bảo rằng chỉ có một văn bản được hiển thị trong cửa sổ trình duyệt của tôi. – Luca

+0

Nếu bạn có một mục portofolio trên một phần, hãy đảm bảo bạn không sử dụng bộ lọc để chỉ hiển thị một danh mục. Đó là một cuộc xung đột. –

2

này chỉ xảy ra với tôi, và tôi đã có dữ liệu gián điệp = "cuộn" trên một yếu tố phụ bên trong một trong những tôi đã cố gắng để di chuyển (nó đã được còn sót lại từ một cái gì đó, không nên có được ở đó). ving này đã khắc phục vấn đề.

1

Latest tài liệu bootstrap gợi ý sau đây

thêm data-spy="scroll" đến các yếu tố bạn muốn để do thám (thường nhất này sẽ là cơ thể) và data-target=".navbar" để chọn NAV sử dụng

Via dữ liệu thuộc tính

<body data-spy="scroll" data-target=".navbar">...</body> 

$(function() { 
    $('#MenuUl a:first').tab('show'); 
    }) 

tôi hy vọng rằng sẽ giúp

+0

Cảm ơn bạn, đã giúp .. Tôi nên đọc nó rõ ràng hơn, bỏ qua phần giới thiệu và đi đến phần sử dụng với phần JavaScript quá nhanh. – knownasilya

12

Nếu bạn có data-spy bộ trên body phần tử, đảm bảo rằng phần tử body không được đặt thành height: 100%;. Đây là vấn đề trong trường hợp của tôi.

+1

Đây là vấn đề của tôi! Cảm ơn – Kyle

+0

Tại sao không đánh dấu câu trả lời này là được chấp nhận? Nó cũng có thể giúp người khác. – wisefish

+0

Làm cách nào để sử dụng chân trang dính và cuộn giấy? – markus

0

Điều này phù hợp với tôi. Tôi đã thêm dữ liệu-gián điệp = "di chuyển" cả trên cơ thể và div tôi muốn được theo dõi trên. Xóa nó đã giải quyết được vấn đề này

0

có cùng vấn đề này. Đã thay đổi bootstrap.min.js thành bootstrap.js

có vẻ như phiên bản thu nhỏ của trình khởi động làm cho số nhận dạng cuối cùng của bạn là trang hoạt động.

Các vấn đề liên quan