2013-04-27 8 views
14

Succede a volte con un testo particolare, passando con CSS3. Non conosco il motivo per cui accade e quindi non riesco a ricreare lo stesso in jsfiddle.La transizione CSS3 lascia una scia

Ma si può guardare al 4 ° scivolo (quello con 5 anelli) qui,

http://jashwant.github.io/kickass-slider/

fredda testo lascia una scia, mentre l'animazione e la pista viene rimosso dopo qualche tempo. Ma altri testi funzionano bene senza lasciare tracce. Non sono in grado di scoprire il problema.

Come posso evitare questo percorso?

(sto usando ultima cromo linux 26.0.1410.63)

P.S. Sto usando jquery-transit per animare.

Vedere l'immagine Cool.

enter image description here

UPDATE:

Here's more detailed answer

+0

Questo è probabilmente un bug in Chrome. Vedo un comportamento simile in 27.0.1453.65 beta-m. Probabilmente dovresti creare un caso di test ridotto e presentare un bug. – Charles

+0

ma non riesco a riprodurre lo stesso in un test case. – Jashwant

+0

Su Linux con Chrome versione 26.0.1410.63, non vedo tracce – regretoverflow

risposta

22

si può fare il oggetti in movimento con accelerazione hardware in Chrome, finché non viene risolto il bug. È sufficiente aggiungere la linea

-webkit-transform: translate3d(0,0,0); 

alla definizione degli oggetti cursore (Nella mia prova, ho aggiunto a:

.slider > li > .object { 

). Questo l'ha risolto per me.

+0

Nessuna spiegazione e nessuna soluzione diversa dalla tua. Ti sto dando tanta ricompensa. La soluzione funziona. – Jashwant

+3

Ho anche trovato questo '-webkit-transform: translateZ (0);' ma non ho rintracciato se è diverso dall'esempio di jangxx. –

+0

Questo ha risolto anche un problema per me ... Questa è una bella soluzione! Grazie jangxx! – AdityaSaxena