28172 sujets

CSS et mise en forme, CSS3

[résolu] Sans transition avec Chrome

Salut,
Je ne comprends pas si c'est normal (je dirais que non ^^), si c'est un bug ou si c'est moi qui fait une erreur parce que j'ai une transition qui ne s'exécute pas dans Chrome.

L'idée est de créé un effet de feuilles empilées et qu'au passage de la souris, les feuilles du dessous changent de direction de façon fluide.

En css, ça donne (j'ai viré les lignes avec prefixe pour vous faciliter la lecture. J'ai aussi viré les lignes avec ou je cible d'autre section enfant de .main. ):


.main {
   position: relative;
   overflow: visible;
	}
	
	.main > section {
	     background-color: #eee;
             box-shadow:  0px 0px 5px 0px rgba(0, 0, 0, 1);
             position: relative;
             padding: 30px;
             margin-bottom: 100px;
	}
	
	
	
	.main > section::before, .main > section::after {
		background: #eee;
   	        box-shadow:  0px 0px 5px 0px rgba(0, 0, 0, 1);
		content: "";
		position: absolute; top: 0; left: 0; right: 0; bottom: 0;
		transition: all 500ms ease;
		}
		
		
		.main > section:nth-child(1)::before {
                          transform: scale(1) rotate(2deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
                          z-index: -2;
		}
			
	       .main > section:nth-child(1)::after {
                     transform: scale(1) rotate(-2deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
                      z-index: -1;
		}


L'effet fonctionne mais je n'ai pas la transition sous Chrome. Smiley ohwell
Modifié par David-Dante (27 Dec 2012 - 15:12)
rodolpheb a écrit :
Oulah je suis fatigué!!

Il faut que j'aille courir...

Salut,
Moi aussi je suis fatigué. Je me suis -encore-trompé de catégorie. Smiley sweatdrop

Désolé pour le modo qui déplacera. Smiley confused
Bonjour,
David-Dante a écrit :


L'effet fonctionne mais je n'ai pas la transition sous Chrome. Smiley ohwell


Oui, c'est parceque les transition sur les pseudo element ::before/::after ne fonctionne pas (encore) avec chrome.

++
rodolpheb a écrit :
Salut,

N'ayant pas rencontré de problèmes similiaires j'ai trouvé ces ressources (que je n'ai pas étudiées) qui peuvent peut-être t'aider.
http://code.google.com/p/chromium/issues/detail?
https://bugs.webkit.org/show_bug.cgi?id=92591

Tiens moi juste au courant sur ce que tu en fais.

Merci. Smiley smile

Salut,
Merci a toi pour tes recherches et à gc-nomade pour sa réponse.
J'ai vu que le "problème" est connu depuis longtemps. Je pensais que webkit était le moteur avant gardiste qui implémente plus vite que son ombre, je suis deçu. Smiley murf
Sujet clos
Aller à