chris samtaler rulle skygger en av hans favoritt CSS-triks gjennom tidene. Lea Verou popularisert den rene CSS-tilnærmingen med fire lags bakgrunnsgradienter med noen smarte background-attachment magi. Resultatet er en smidig rulleinteraksjon som gir brukerne et hint om at ekstra innhold er tilgjengelig i en rullbar beholder.
Bare ett problem: det blakk i Safari iOS 13. En dag var alt bra. Den neste, ikke så mye. Og det var ikke det eneste som ble berørt. Keith Clarks CSS-bare parallakseeffekt sluttet også å fungere akkurat da.
Vel, leser Ronald skrev inn å si at alt fungerer igjen! Faktisk skriver jeg dette på iPaden min (Safari 15.5) akkurat nå, og Chris sin demo ser skarp ut som alltid. Det samme er Keiths original demo.
Så, hva brøt den? Vi vet fortsatt ikke. Men Safari 13 versjonsmerknader gi ledetråder:
- Lagt til støtte for én-finger akselerert rulling til alle rammer og
overflow:scrollelementer som eliminerer behovetset-webkit-overflow-scrolling: touch.- Endret standardoppførselen på iPad for brede nettsider med responsive metakoder som krever horisontal rulling. Sidene skaleres for å forhindre horisontal rulling, og all tekst endres for å bevare lesbarheten.
Når ble det fikset og hva fikset det? Vel, på rulleskyggesiden, Safari 15.4 inkludert noe arbeid med background-attachment: local det kan ha gjort susen. På parallaksesiden, Safari 14.1 la til støtte for individuelle transformasjonsegenskaper ... så kanskje det?
