Chris en cours faire défiler les ombres l'un de ses CSS-Tricks préférés de tous les temps. Léa Vérou popularisé l'approche CSS pure utilisant quatre dégradés d'arrière-plan en couches avec quelques astucieux background-attachment
la magie. Le résultat est une interaction de défilement fluide qui indique aux utilisateurs que du contenu supplémentaire est disponible dans un conteneur déroulant.
Un seul problème : il cassé dans Safari iOS 13. Un jour, tout allait bien. Le suivant, pas tellement. Et ce n'était pas la seule chose affectée. Effet de parallaxe CSS uniquement de Keith Clark a également cessé de travailler à ce moment-là.
Eh bien, lecteur Ronald a écrit dans dire que tout fonctionne à nouveau ! En fait, j'écris ceci sur mon iPad (Safari 15.5) en ce moment et la démo de Chris est plus nette que jamais. Il en va de même pour Keith démo originale.
Alors, qu'est-ce qui l'a cassé? Nous ne savons toujours pas. Mais le Notes de version de Safari 13 proposer des indices :
- Ajout de la prise en charge du défilement accéléré à un doigt vers toutes les images et
overflow:scroll
éléments éliminant le besoin deset-webkit-overflow-scrolling: touch
.- Modification du comportement par défaut sur iPad pour les pages Web larges avec des balises méta réactives nécessitant un défilement horizontal. Les pages sont mises à l'échelle pour empêcher le défilement horizontal et tout texte est redimensionné pour préserver la lisibilité.
Quand a-t-il été réparé et qu'est-ce qui l'a réparé ? Eh bien, du côté de l'ombre du défilement, le Safari 15.4 inclus quelques travaux sur background-attachment: local
ça a peut-être fait l'affaire. Côté parallaxe, Safari 14.1 ajoutée prise en charge des propriétés de transformation individuelles… alors peut-être que ça ?
- article
- pièce jointe en arrière-plan
- blockchain
- C + +
- code
- cognitif
- navigateur croisé
- Astuces CSS
- Java
- jeton non fongible
- OpenSea
- PHP
- Platon
- platon ai
- Intelligence des données Platon
- Jeu de Platon
- Platoblockchain
- PlatonDonnées
- jeu de platogamie
- Polygone
- Python
- Réagir
- Safari
- défilement
- contrat intelligent
- Solana
- Vyper
- Web3
- zéphyrnet