Thực sự lạ "vẽ lại hành vi" với các liên kết anchor, twitter bootstrap cố định navbar và affix plugin

Question

Tôi đang gặp phải một hành vi cực kỳ kỳ lạ khi sử dụng plugin Affix của Twitter Bootstrap, navbar cố định và liên kết anchor với nhau. Tôi sẽ cố gắng giải thích vấn đề của mình nhưng rất khó để nói thành lời, vì vậy hãy tha thứ cho tôi nếu tôi không rõ ràng nhất.

Tôi có một số navbar-fixed-top ở đầu trang của tôi. Theo đó tôi có số tiền là .container div. Bên trong tôi có hai div.spans (span4 và span8). Bên trong span4 là một div.well có lớp affix-top được áp dụng cho nó (vì vậy nó được đặt cố định và "gậy" ở vị trí cố định). Bên trong span8 Tôi có một loạt nội dung.

Bên trong số well div có nav-list. Danh sách này được điền bằng các phần tử li/a dựa trên các mục trong span8 (Tôi có một tập lệnh nhỏ thực hiện việc này). Các liên kết là các neo, vì vậy chúng trỏ đến các phần tử trên trang (#myId, #myIdTwo, v.v ...). Tất cả điều này hoạt động tuyệt vời. Danh sách của tôi ở đó, các liên kết có thể nhấp được, chúng đưa tôi đến các phần tử của tôi. Tuyệt quá.

Tuy nhiên, không tuyệt vời. Đôi khi, khi tôi nhấp vào một trong các liên kết, tôi đi đến neo của tôi trong span8 nhưng trang dường như không làm mới đúng cách. Thỉnh thoảng tôi thấy những "chiếc hộp" màu trắng kì lạ. Hoặc nội dung trong khoảng thời gian sẽ hiển thị một phần phía trên cố định nav-header. Đôi khi một nửa số nav-list biến mất .. nhưng sau đó trở lại (sắp xếp) nếu tôi di chuyển chuột xung quanh nó. Giống như bạn thường thấy trong một số ứng dụng Windows cũ đã bị sa lầy.

Bạn có thể tự mình xem tại đây: http://jaylach.github.com/lutra. Bạn có thể cần nhấp vào một số liên kết điều hướng một vài lần trước khi bạn gặp sự cố.

Tôi đã đấu tranh với điều này cả ngày và tôi không thể, cho cuộc sống của tôi, con số nó ra. Tôi đã đưa ra các dấu, tôi đã đưa ra các thanh điều hướng cố định hàng đầu, tôi đã lấy ra z-index của tôi. Tôi không thể hình dung ra được.

Có ai, ở đâu, có bất kỳ đầu mối nào về những gì có thể gây ra điều này không? Tôi thực sự sẽ đánh giá cao bất kỳ lời khuyên nào các bạn có thể đưa ra.

Rất cám ơn trước !!

Answer 1

Đây là lỗi WebKit.

thêm -webkit-transform: scale3d(1,1,1); cho cả .navbar-fixed-top và .affix

cả hai phong cách được định nghĩa trong bootstrap.min.css. Vì vậy, ghi đè 2 kiểu này trong số main.css của bạn là:

.affix,.navbar-fixed-top { 
-webkit-transform: scale3d(1,1,1); 
}