Cách chặn SWF bên trong tab Giao diện người dùng jQuery tải lại

Question

Tôi có một phim SWF bên trong tab Giao diện người dùng jQuery và vấn đề tôi gặp phải là SWF được tải lại mỗi khi tôi nhấp vào tab trên tab khác , sau đó bấm lại. Tôi có thể kiểm tra DOM và thấy rằng div chứa SWF vẫn còn trong DOM khi tôi nhấp chuột đi, vì vậy tôi không biết tại sao điều này dường như tải lại khi tôi nhấp lại vào tab.

tôi đã thêm các quy tắc CSS sau đây để cố gắng ngăn chặn màn hình được thiết lập để: none, nhưng bộ phim flash vẫn tải lại:

.ui-tabs .ui-tabs-hide { 
    display: block !important; 
    position: absolute; 
    left: -10000px; 
} 

Cập nhật: Hóa ra này có liên quan đến Firefox bug sau đó đã có từ năm 2001/Firefox 0.9. Tôi vẫn chưa có cách giải quyết tốt.

Answer 1

Các giải pháp đề cập trước đó làm việc trong Chrome nhưng không phải trong Firefox vì lý do gì (tôi khá chắc chắn nó đã làm việc một thời gian trước). Tôi đã tìm thấy một giải pháp khác:

trước tiên, bạn cần quy tắc chung để "ẩn" nội dung mà không sử dụng display: none;

/** hide the tab without using display:none; **/ 
.ui-tabs .ui-tabs-hide {  
display: block !important; 
height: 0!important; 
width: 0!important; 
border:none!important; 
visibility:hidden!important; 

}

/** make sure your swf does not have leftover height when hidden **/ 
.ui-tabs .ui-tabs-hide object, 
.ui-tabs .ui-tabs-hide embed { 
    height: 0; 
    width: 0; 
} 

Nó làm việc cho tôi. Hãy cho tôi biết nếu làm việc cho bạn! Jerome WAGNER

Answer 2

Một số trình duyệt (ví dụ firefox) đang tải lại phim flash ngay khi bạn ẩn/hiển thị (hiển thị: không có;) trên chúng. Đây là những gì đang xảy ra với hệ thống tab. Giải pháp duy nhất tôi biết là để

1. có đèn flash với một position: absolute;
2. lắng nghe những sự kiện của hệ thống tab
3. đảm bảo đèn flash được chuyển vào và ra khỏi quan điểm màn hình khi tab được hiển thị/ẩn

này có thể trở nên phức tạp nếu bạn muốn có một đa-flash , giải pháp chung chung ..

tôi hy vọng điều này sẽ giúp bạn

Answer 3

Cũng giống như bản cập nhật cho câu trả lời được chấp nhận. Trong các phiên bản mới hơn của jQuery UI, các lớp đã thay đổi.

.ui-tabs .ui-tabs-hide 

trong css bây giờ cần được thay thế bằng:

.ui-tabs .ui-tabs-panel[aria-hidden="true"] 

Hy vọng rằng sẽ giúp