Sửa lỗi background bị giật khi swipe qua lại trên Ipad

Hôm nay tìm ra & fix được lỗi rất chuối khi swipe trên Ipad thì background image có thuộc tính background-size: cover bị giật.

Lý do là background image không hiểu do vô tình hay cố ý bị nhét thêm thuộc tính: no-repeat vào. Theo như mô tả của W3shools thì giá trị cover của background-size là:

Scale the background image to be as large as possible so that the background area is completely covered by the background image. Some parts of the background image may not be in view within the background positioning area

Rõ ràng, nếu đã scale tới giá trị lớn nhất có thể của kích thước containner thì no-repeat không cần thiết nữa, thử bỏ nó đi và đúng là lỗi đã được fix thật 🙂

Cập nhật: sau khi test lại thì lỗi chính xác là do thuộc tính background-attachment: fixed gây ra. Hiện vẫn chưa biết giải quyết thế nào với trường hợp này, vì nếu bỏ “fixed” đi thì với page có nội dung dài thì background sẽ không scale được toàn bộ màn hình 🙁

2 thoughts on “Sửa lỗi background bị giật khi swipe qua lại trên Ipad

  1. Hehe
    e làm trên Phonegap cũng bị lỗi này trên Android

    Kinh nghiệm của em là bất cứ cái j liên quan đến backgroudn e cũng cho vào element riêng hoặc cho vào before/after, k để lẫn lộn vào div chứ content.

    Sau đó position fixed cái element đó là xong 😀

Leave a Reply to Thien Cancel reply

Your email address will not be published. Required fields are marked *