Android hack hộp kiểm nguyên nhân di chuyển trang web trên iPhone

Question

Tôi đã sử dụng Advanced checkbox hack để ẩn và hiển thị menu đáp ứng của mình. Các hack là cần thiết để cho phép Android < 4.1.2 để thực sự khai thác các chuyển đổi - nó không hoạt động mà không có hack.

Bây giờ nó chỉ ra rằng phần hình ảnh động của hack

body { 
    -webkit-animation: bugfix infinite 1s; 
} 
@-webkit-keyframes bugfix { 
    from {padding:0;} 
    to {padding:0;} 
} 

gây phong trào thực tế trong ít nhất một chiếc iPhone. Làm thế nào để ngăn chặn hack này làm hỏng trải nghiệm trang web cho người dùng iPhone?

Tôi có bản xem trước trực tiếp với lỗi over here. Một bộ phim có lỗi hiển thị được nhìn thấy here.

Answer 1

Hóa ra là tôi đã có một quy tắc css quy tắc * { transition: all .5s ease; } css để áp dụng cho tất cả các hình ảnh động — bao gồm hack này. Điều này gây ra lỗi.

Xóa quy tắc này và áp dụng thủ công nội dung của nó cho tất cả hoạt ảnh của tôi đã khắc phục sự cố.

Answer 2

Tôi không có Android để kiểm tra điều này nhưng sẽ không hoạt động khi chỉ áp dụng cho một phần tử thay vì toàn bộ cơ thể?

.toggle { 
    -webkit-animation: bugfix infinite 1s; 
} 

@-webkit-keyframes bugfix { 
    from { padding: 0; } 
    to { padding: 0; } 
} 

Chừng nào bạn không có bất kỳ đệm vào đó yếu tố