après avoir assidument éplucher les cours HTML/CSS/Javascript sur le site je me suis jeté dans le grand bain et je crée un site très fortement inspiré de ça
J'avance petit à petit, j'ai mis en place l'affichage de la page principale mais j'ai un souci. Sous Safari (9) j'ai de gros problèmes de fluidité au chargement de la page (Les éléments sur lesquels j'effectue une transition, à savoir mon bg:before et ma boxID, ne sont pas du tout fluide, on dirait un film avec 4 ou 5 images/sec au lieu de 24 ). Je comprends pas du tout d'où ça peut venir ???
Sous Chrome et Firefox ça marche nickel, j'ai essayé de vider mes caches, ça ne change rien.
Je bosse sur un MBP, Safari est mon navigateur par défaut, je l'utilise quotidiennement (sans problème particulier) alors que les 2 autres sont pour un usage d'appoint.
J'ajoute les classes .load et .active avec un script jQuery dans mon fichier HTML.
Parce que mes transitions je les fais sur le background-color d'un élément d'une part, et la hauteur et l'opacité pour la box d'autre part. Et ça ne merdoit pas que pour l'opacité. L'ouverture de ma boxID et l'affichage de mon background sont exécrables...
Et merci pour ta remarque sur transform et filter, ça m'évitera d'autres déconvenues !
Malgré les recommandations la transition sur le blur (ou plutôt le filter ) elle fonctionne nickel, sur tous mes navigateurs.
Mais ça rame toujours sur celle du chargement de la page principale...j'ai essayé d'ajouter un délai via un window.setTimeout dans mon script mais ça ne change rien !
je t'ai donné la solution (sauf si il y en a une que je ne connais pas...) pour améliorer les performances, tu va devoir passer sur une solution en canvas. une transition su un blur te causera des ralentissements dans tous les cas...
A la limite tu peux faire un test en modifiant le transform:
J'ai mis Safari de côté et me suis concentré sur Firefox et Chrome pour continuer mes dev. Et là après quelques jours je viens de refaire un test sur Safari et tout fonctionne nickel...
Mystères...
Pour la solution en canvas je verrai par la suite, j'ai déjà pas mal de trucs à digérer et je me sens pas de me lancer sur de la nouveauté alors que tout fonctionne. Surtout que d'après le cours la partie sur canvas c'est un bon morceau !!
De retour au source
Problème de fluidité de transition CSS sous safari
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.