chris puhelut rullaa varjoja yksi hänen kaikkien aikojen suosikki CSS-temppuistaan. Lea Verou suosituksi puhdas CSS-lähestymistapa, jossa käytetään neljää kerrosta taustagradienttia ja joitain älykkäitä background-attachment taika. Tuloksena on liukas vieritysvuorovaikutus, joka antaa käyttäjille vihjeen siitä, että lisäsisältöä on saatavilla vieritettävässä säilössä.
Vain yksi ongelma: se mursi Safari iOS 13:ssa. Eräänä päivänä kaikki oli hyvin. Seuraava, ei niin paljon. Eikä se ollut ainoa asia, joka vaikutti. Keith Clarkin vain CSS-parallaksiefekti myös lakkasi toimimasta juuri silloin.
No lukija Ronald kirjoitti sanoa, että kaikki toimii taas! Itse asiassa kirjoitan tätä iPadillani (Safari 15.5) juuri nyt ja Chrisin demo näyttää terävältä kuin koskaan. Samoin Keithin alkuperäinen demo.
Joten mikä sen rikkoi? Emme vieläkään tiedä. Mutta Safari 13:n julkaisutiedot tarjota vihjeitä:
- Lisätty tuki yhdellä sormella kiihdytettyyn vieritykseen kaikkiin kehyksiin ja
overflow:scrollelementtejä, jotka poistavat tarpeenset-webkit-overflow-scrolling: touch.- Muutettiin iPadin oletuskäyttäytymistä leveillä verkkosivuilla, joissa on reagoivia metatunnisteita, jotka vaativat vaakasuuntaista vieritystä. Sivut skaalataan vaakasuuntaisen vierityksen estämiseksi ja tekstin kokoa muutetaan luettavuuden säilyttämiseksi.
Milloin se korjattiin ja mikä korjasi? No, vieritysvarjopuolella Safari 15.4 mukana jonkin verran töitä background-attachment: local se saattoi tehdä tempun. Parallaksipuolella Safari 14.1 lisä- tuki yksittäisille muunnosominaisuuksille… niin ehkä se?
