Dịch CSS với vw không hoạt động trên iOS <8, giải pháp thay thế?

Question

Rõ ràng làm transform: translate với vw đơn vị không hoạt động trên iOS < 8.

Đây là một bản demo, so sánh dịch%, hoạt động trên cả hai điện thoại di động và không di động, và vw mà chỉ hoạt động trên iOS 8+ và không di động:

http://codepen.io/rachel-carvalho/pen/azmoPJ?editors=110

#p { 
    -webkit-transform: translate(10%, 0); 
    transform: translate(10%, 0); 
} 

#vw { 
    -webkit-transform: translate(10vw, 0); 
    transform: translate(10vw, 0); 
} 

tôi không biết nếu thiết bị di động khác có một vấn đề dịch vw, nhưng tôi không thể tìm thấy bất cứ điều gì trên web về vấn đề này.

Tôi đã tự hỏi liệu có ai khác đã gặp sự cố này và nếu có cách đáng tin cậy để phát hiện hành vi này, vì vậy tôi có thể giải quyết vấn đề với javascript.

Answer 1

tôi đã phải đối mặt với cùng một vấn đề trong quá khứ với vmax, vw đối với một số trình duyệt (đặc biệt IE) và nhận biết rằng nó không hỗ trợ nhưng họ là một sự hỗ trợ một phần cho rằng đôi khi nó có thể làm việc một số lần nó có thể không, Check here

cho rằng bạn có thể sử dụng một thư viện jquery mà chuyển đổi vw để px động buggyfill .js

Hy vọng nó sẽ làm việc cho bạn!