jQuery - cách nhận/đọc thuộc tính css trên: hover pseudo class

Question

Tôi đang làm việc trên trình tải trước hình ảnh sẽ tải trước tất cả hình ảnh trên một trang. Cách tiếp cận của tôi là như sau:

onDomReady, lặp qua $("*") // đi qua tất cả các yếu tố khi DOM đã sẵn sàng

• nếu $(this).tagName.toLowerCase() == 'img', đọc src thuộc tính, và tải trước hình ảnh mà
• else if $(this).css("background-image") != "none", đọc nền chống đỡ hình ảnh và tải trước hình ảnh đó

Vấn đề của tôi là cách tiếp cận này không nhận được trên: lớp di chuột, thường là hình ảnh cần o được tải trước.

Điều tôi muốn làm là có thể, trong khi lặp qua tất cả các phần tử, kiểm tra sự tồn tại của lớp giả: hover và sau đó kiểm tra sự tồn tại của thuộc tính "background-image" trên lớp đó.

Tôi thực sự muốn gắn bó với phương pháp này, vì nó a) cho phép tôi không phải chỉ định rõ ràng từng hình ảnh tôi muốn tải trước và b) quản lý các đường dẫn tương đối trong CSS, như đọc thuộc tính "background-image" mang lại cho tôi đường dẫn tương đối so với trang.

Vì vậy, câu hỏi của tôi là:

là là có thể, sử dụng jQuery, để đọc các thuộc tính CSS trên: hover lớp giả cho một yếu tố? Nếu không, bất kỳ đề xuất?

Cảm ơn!

Answer 1

Điều này sẽ rất chuyên sâu khi tải trang để tìm kiếm qua tất cả hình ảnh DOM/CSS ... có thể không phải là ý tưởng hay trên trang web công cộng. Một lựa chọn tốt là sử dụng các hình ảnh sprites (http://www.google.com/images/nav_logo26.png) và định vị chúng bằng CSS

Answer 2

Có vẻ như các sprites là giải pháp phù hợp cho vấn đề này. Nhưng nếu chúng không thể được thực hiện vì một lý do nào đó, những gì bạn muốn làm là truy cập bộ sưu tập document.styleSheets để tìm kiếm các quy tắc với: hover trong chúng. This page sẽ giúp bạn bắt đầu.