Кріс дзвінки прокручування тіней один із його улюблених CSS-трюків усіх часів. Леа Веру популяризовано чистий підхід CSS із використанням чотирьохшарових градієнтів фону з деякими розумними background-attachment
магія. Результатом є зручне прокручування, яке дає користувачам натяк на те, що додатковий вміст доступний у прокручуваному контейнері.
Тільки одна проблема: вона зламав у Safari iOS 13. Одного разу все було добре. Наступний, не дуже. І це не єдине, що вплинуло. Паралакс-ефект Кіта Кларка лише для CSS також перестав працювати прямо тоді.
Ну, читачу — написав Рональд знову сказати, що все працює! Фактично, я пишу це на своєму iPad (Safari 15.5) прямо зараз, і демонстрація Кріса виглядає чіткою, як ніколи. Так само й у Кіта оригінальна демонстрація.
Отже, що його зламало? Ми ще не знаємо. Але Примітки до випуску Safari 13 пропонувати підказки:
- Додано підтримку прискореного прокручування одним пальцем до всіх кадрів і
overflow:scroll
елементи, що усувають необхідністьset-webkit-overflow-scrolling: touch
.- Змінено поведінку за замовчуванням на iPad для широких веб-сторінок із адаптивними мета-тегами, які потребують горизонтального прокручування. Сторінки масштабуються, щоб запобігти горизонтальній прокрутці, а розмір будь-якого тексту змінюється, щоб зберегти розбірливість.
Коли це було виправлено і що це виправило? Що ж, на стороні тіні прокрутки Safari 15.4 включені деяка робота над background-attachment: local
це, можливо, зробило свою справу. З боку паралакса Safari 14.1 доданий підтримка індивідуальних властивостей перетворення… можливо це?