Tôi đã gặp phải một số trường hợp lạ về vấn đề định vị khi tải xuống CSS chậm trong Chrome, ví dụ: vị trí của một số yếu tố (tuyệt đối, tương đối và cascaded) được tắt bởi đôi khi biên độ rất lớn. Về cơ bản những gì tôi đang làm là loại bỏ tải biểu định kiểu chuẩn thông qua một liên kết-Tag và thay vào đó đặt một khoảng giữ chỗ-Tag để có một cách dễ dàng để lấy URL sau này vào cuối của body-Tag. Sau khi DOM được nạp đầy đủ, tôi thay thế span-Tag với một tạo liên kết Tag như thế này:CSS Tải xuống Lười biếng trong Chrome
loadCSS: function()
{
var el = jQuery('.is_css');
if(!el.length) return;
// Build link element
var linkEl = jQuery('<link />').attr({
media: 'all',
type: 'text/css',
rel: 'stylesheet',
href: el.data('src')
});
el.replaceWith(linkEl);
}
tôi có thể xác minh rằng CSS được nạp đầy đủ như hầu hết các yếu tố đang tìm kiếm chính xác như nếu tôi nhúng CSS trực tiếp trong thẻ head-tag. Tôi đoán là Chrome không tính toán chính xác vị trí trong một số trường hợp cho các yếu tố vị trí tuyệt đối hoặc tương đối khi CSS được tải sau khi DOM đã được tải.
Tôi muốn cung cấp cho bạn các đoạn mã HTML/CSS, thật không may là nó nằm ngoài phạm vi để cô lập các yếu tố được hiển thị sai. Vì vậy, thay vào đó, tôi hỏi nếu có ai gặp phải các vấn đề tương tự có thể gây ra hành vi này. Có thể có một số gợi ý chung về cách khắc phục các vấn đề như vậy.
Kind coi
là bạn lười biếng tải tất cả CSS của bạn hoặc chỉ những phần bổ sung? – diggersworld
Bạn đã xem xét điều này: https://github.com/rgrove/lazyload - nó không còn được cập nhật hoặc duy trì nhưng nó có thể cung cấp giải pháp hoặc cơ sở để bạn tạo phiên bản của riêng mình. – Todd
Điều gì xảy ra nếu bạn buộc repaint ** sau khi ** CSS đã được tải? [repaint snippet] (http://pastebin.com/V4YverjY) –