javascript - Khi sử dụng chuyển đổi/hoạt hình CSS, v.v., cách tốt nhất để dự phòng sang jQuery nếu trình duyệt của người dùng không hỗ trợ hoạt hình CSS là gì?

Tôi đang tìm một cách để sử dụng các hoạt ảnh CSS, nhưng nếu trình duyệt của người dùng không hỗ trợ hoạt ảnh CSS - thì sẽ chuyển sang sử dụng Jquery cho hoạt ảnh. Có cách nào dễ dàng để làm điều này bằng Jquery không? Một plugin cũng được, nếu đó là một plugin nhỏ, nhưng tôi thực sự đang tìm một cách để làm điều này bằng Jquery nếu có thể. Lý do duy nhất tôi muốn sử dụng các hoạt ảnh CSS là vì chúng sử dụng ít năng lượng xử lý hơn nhiều khi sử dụng hoạt ảnh CSS.

Câu trả lời #1

Plugin jQuery animate nâng cao sử dụng các chuyển đổi CSS mà không cần phải viết mã cụ thể cho các trình duyệt có khả năng chuyển đổi

Phương án thay thế không mấy khả quan: bạn có thể thêm một thư viện phát hiện tính năng như Modernizr và sau đó viết mã cụ thể cho từng trường hợp, chẳng hạn như...

if (Modernizr.csstransitions) {
  $("#yourdiv").css({
    "-webkit-transform" : "translate(0, 10)",
    "-o-transform" : "translate(0, 10)",
    "-moz-transform" : "translate(0, 10)",
    "-ms-transform" : "translate(0, 10)",
    "transform" : "translate(0, 10)"
});
}
else {
  //do jquery animate stuff
}

Câu trả lời #2

Bạn không nên quan tâm đến điều đó. Hoạt hình không quan trọng. Nếu bạn thực hiện cải tiến theo từng bước, mỗi người dùng sẽ có được trải nghiệm tốt nhất mà trình duyệt của họ cho phép :).

Nếu bạn quan tâm quá nhiều đến "sức mạnh xử lý", bạn sẽ không muốn có bất kỳ hiệu ứng hoạt hình nào trên IE cả. Nếu không, chỉ sử dụng jQuery, điều đó có vẻ là tốt nhất cho nhu cầu cụ thể của bạn.