Les bugs...
bug sur animation-delay avec certains navigateurs lors du premier chargement de la page. (les animations de chaque bloc se chargent simultanément)
bug sur "replay demo" sur les navigateurs autres que Chrome/Safari : la déclaration animation-play-state : running ne relance pas l’anim... (a tester)
Note : Ajout de tous les préfixes navigateurs avec prefixmycss
#1par Azledev, le 3 décembre 2011
Aucune explication ? Effet très réussis, dommage de réduire sa a un simple copier coller quand même . Nous donner des explications sa nous permettra de créer un truc dans le même genre nous même :)
Merci quand même, je suis scotché par les possibilité du CSS3.
#2par css3create, le 5 décembre 2011
@Azledev : ceci est juste une démo ! Si tu as vu (et testé) mon tuto précédent sur les transformations 3D, tu ne devrais pas avoir de soucis pour réaliser cette démo. Le principe est le même, mis à part l’utilisation d’animation CSS.
#3par Azledev, le 6 décembre 2011
Autant pour moi, je n’avais pas vu ! J’vais voir le lien que tu donne pour le code sur html5-css3 ! :)
En tout cas merci beaucoup, depuis un moment ce site est dans mes favoris, pour tout te dire je m’inspire beaucoup de tes créations mais aussi du design de ton site ! Etant fan des couleurs je n’ai pu m’empêcher de les prendre pour moi . En espérant que sa ne te dérange pas ! Bonne continuation ! ;)
#4par LukyVj, le 7 décembre 2011
J’adore, le CSS3 m’épatera toujours !
Votre site est une référence en termes de qualité.
+1
#5par meeko, le 21 septembre 2012
le replay ne marche pas sous firefox une idée pour relancer l’anim ?
#6par css3create, le 21 septembre 2012
@meeko : Tu peux tenter avec du JS en ajoutant et en retirant une classe. J’avais fais un truc du genre en jQuery :
$('#replay').bind("click", {obj: "#typo div p"},function(e){
$(e.data.obj).toggleClass('anim');
return false;
});
En gros, lors du clic sur le bouton, tu toggle la classe des éléments contenus dans #typo. Il ne faut pas oublier d’ajouter au moins une fois la classe au départ pour que l’anim se lance.
#7par meeko, le 21 septembre 2012
après un essai sur vôtre animation avec le code fourni js le replay ne marche pas.
#8par css3create, le 21 septembre 2012
@meeko : jQuery est-il bien chargé ? Le DOM est-il entièrement chargé ?
#9par meeko, le 21 septembre 2012
une erreur été apparu, merci bien.
#10par Con’Art, le 28 avril 2013
Vraiment sympa comme effet. J’apprend pas a pas sur ce site !