jQuery UI có tùy chọn để khởi tạo các tab với các tab thiết lập để fade in/out, như vậy:Làm thế nào tôi có thể làm mờ các tab trong và ngoài bằng khung công tác Twitter Bootstrap?
$(".selector").tabs({ fx: { opacity: 'toggle' } });
là một cái gì đó tương tự có thể với các tab khuôn khổ Twitter Bootstrap?
Không, nhưng bạn có thể thêm riêng của bạn, jsFiddle
$('.tabs').tabs()
.bind('change', function (e) {
$(this).next().hide().fadeIn();
});
Cả hai cho Bootstrap 2 và 3, bạn chỉ có thể cung cấp cho .tab-pane yếu tố của bạn một lớp fade với bootstrap-transition.js nạp. Không cần phải viết một dòng mã JavaScript của riêng bạn cả.
<div class="tab-content">
<div class="tab-pane fade in active" id="home">...</div>
<div class="tab-pane fade" id="profile">...</div>
<div class="tab-pane fade" id="messages">...</div>
<div class="tab-pane fade" id="settings">...</div>
</div>
Mẫu mã từ the official Twitter Bootstrap documentation.
Nếu chúng ta sẽ cung cấp cho lớp mờ dần cho tất cả chúng, nó sẽ ẩn nội dung của tất cả các tab.Answer sẽ có ít nhất một trong các tab nên có 'in' sau khi fade class được viết để làm việc. – Seeker
Tôi tin câu trả lời này + nhận xét của PHPSeeker là giải pháp phù hợp hơn cho vấn đề này, vì họ sử dụng các cơ sở do khung công tác cung cấp và do đó trả lời tốt hơn câu hỏi như đã nêu (và, cá nhân, tham chiếu đến '.in' đã lưu cho tôi một rất nhiều đau đầu ngay bây giờ) – roguesys
Đây phải là câu trả lời được chấp nhận. Nó cũng hoạt động trong Bootstrap 3. –
Xem câu trả lời của Sanghyun. Đó là cách chính xác để làm điều này. –
kiểm tra câu trả lời của @baxang. đó là một trong những quyền. – littlealien