Thay vì làm việc xung quanh IE 7 và 8 thiếu sót, bạn có thể làm cho IE 7-8 thực sự hỗ trợ truy vấn phương tiện truyền thông!
Tôi sử dụng tuyệt đối Respond.js chèn lấp để bật truy vấn phương tiện trong IE 7 và 8. Chỉ cần thêm mã này vào HTML <head>
của bạn và bạn đã sẵn sàng!
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.1.0/respond.min.js"></script>
<![endif]-->
Bạn cũng có thể muốn kích hoạt selectors CSS3 trong IE 7 và 8 để những thứ như .column:nth-child(#{$i}n) { @include float-span(1, 'last'); }
sẽ làm việc.
Bạn sẽ cần vùng chèn Selectivizr. Để Trả lời làm việc cùng với Selectivizr, Selectivizr phải là phiên bản 1.0.3b hoặc mới hơn (chưa được giải phóng là ổn định for two years vì một lý do nào đó) và phải là được tải trước khi Trả lời. Selectivizr cũng yêu cầu NWMatcher hoặc thay thế để được tải trước đó. Vì vậy, theo đúng thứ tự là:
<!--[if lt IE 9]>
<script src="//s3.amazonaws.com/nwapi/nwmatcher/nwmatcher-1.2.5-min.js"></script>
<script src="//html5base.googlecode.com/svn-history/r38/trunk/js/selectivizr-1.0.3b.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.1.0/respond.min.js"></script>
<![endif]-->
Và bạn hoàn toàn cũng cần phải có sự html5shiv polyfill (aka html5shim) để làm cho IE 7-8 hỗ trợ các công cụ CSS3 cơ bản nhất.
Vì vậy, thiết lập cuối cùng của tôi về IE 7-8 polyfills trông như thế này:
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
<script src="//s3.amazonaws.com/nwapi/nwmatcher/nwmatcher-1.2.5-min.js"></script>
<script src="//html5base.googlecode.com/svn-history/r38/trunk/js/selectivizr-1.0.3b.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.1.0/respond.min.js"></script>
<![endif]-->
Lưu ý: không sử dụng IE9.js kết hợp với những người như nó sẽ làm cho IE 8 đóng băng.
Nguồn
2013-05-24 09:46:13
Bạn có lưu trữ các tệp .js này cục bộ không? Bạn có thể liên kết với họ qua CDN không? Cảm ơn, –
Bạn có thể biết từ các thẻ tập lệnh mà chúng được lưu trữ trên CDN. Bạn có thể sao chép mã HTML và sử dụng nó trong dự án của bạn mà không sửa đổi. –
Vui lòng không sử dụng Respond.js hoặc Selectivizr. Cả Respond.js và Selectivizr đều tạo ra các yêu cầu HTTP bổ sung cho mỗi mục mà chúng cần phải làm việc và thêm vào bloat vào đường dẫn tới hạn của bạn. Chỉ trả lời các tác phẩm với PX/mQs có chiều rộng tối thiểu dựa trên PX và Selectivizr quá chậm đến mức tôi đã gặp sự cố IE8 với số lượng mục không hợp lý mà nó phải làm việc. Thay vào đó, hãy làm việc với các giới hạn của các trình duyệt bạn đang hỗ trợ và sử dụng tính năng phát hiện và lớp học để hỗ trợ dự phòng. – Snugug