Domande taggate «css-animations»

Le animazioni CSS rendono possibile animare le transizioni da una configurazione di stile CSS a un'altra. Il modulo CSS descrive un modo per gli autori di animare i valori delle proprietà CSS nel tempo, utilizzando i fotogrammi chiave. Il comportamento di queste animazioni di fotogrammi chiave può essere controllato specificandone la durata, il numero di ripetizioni e il comportamento di ripetizione.

4
Mantenimento dello stato finale alla fine di un'animazione CSS3
Sto eseguendo un'animazione su alcuni elementi impostati opacity: 0;nel CSS. La classe di animazione viene applicata su Click e, usando i fotogrammi chiave, cambia l'opacità da 0a 1(tra le altre cose). Sfortunatamente, quando l'animazione termina, gli elementi tornano a opacity: 0(sia in Firefox che in Chrome). Il mio pensiero naturale …
10
Come rendere il testo lampeggiante / lampeggiante con CSS 3
Attualmente, ho questo codice: @-webkit-keyframes blinker { from { opacity: 1.0; } to { opacity: 0.0; } } .waitingForConnection { -webkit-animation-name: blinker; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: cubic-bezier(.5, 0, 1, 1); -webkit-animation-duration: 1.7s; } Lampeggia, ma lampeggia solo in "una direzione". Voglio dire, svanisce e poi riappareopacity: 1.0 , poi svanisce di …
11
animazione di transizione css3 al caricamento?
È possibile utilizzare l'animazione di transizione CSS3 al caricamento della pagina senza utilizzare Javascript? Questo è un po 'quello che voglio, ma al caricamento della pagina: http://rilwis.googlecode.com/svn/trunk/demo/image-slider.html Quello che ho trovato finora CSS3 ritardo di transizione , un modo per ritardare gli effetti sugli elementi. Funziona solo al passaggio del …
8
Arresto di un'animazione CSS3 sull'ultimo fotogramma
Ho un'animazione CSS3 in 4 parti riprodotta al clic, ma l'ultima parte dell'animazione è pensata per toglierla dallo schermo. Tuttavia, torna sempre al suo stato originale una volta che ha giocato. Qualcuno sa come posso fermarlo sul suo ultimo frame CSS (100%) , oppure come sbarazzarsi di tutto il div …
8
Animazione Spin CSS3
Ho esaminato alcune demo e non ho idea del perché non riesco a far funzionare il giro CSS3. Sto usando l'ultima versione stabile di Chrome. Il violino: http://jsfiddle.net/9Ryvs/1/ div { margin: 20px; width: 100px; height: 100px; background: #f00; -webkit-animation-name: spin; -webkit-animation-duration: 40000ms; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 40000ms; …
9
CSS: Animation vs. Transition
Quindi, capisco come eseguire sia transizioni che animazioni CSS3. Ciò che non è chiaro, e ho cercato su Google, è quando usare quale. Ad esempio, se voglio far rimbalzare una palla, è chiaro che l'animazione è la strada da percorrere. Potrei fornire fotogrammi chiave e il browser farebbe i frame …
9
Imitazione di un tag lampeggiante con animazioni CSS3
Voglio davvero far lampeggiare un pezzo di testo nello stile della vecchia scuola senza usare javascript o la decorazione del testo. Nessuna transizione, solo * lampeggio *, * lampeggio *, * lampeggio *! EDIT : Questo è diverso da questa domanda perché chiedo di battere le palpebre senza transizioni continue, …
5
Riproduci più animazioni CSS contemporaneamente
Come posso avere due animazioni CSS che vengono riprodotte a velocità diverse ? L'immagine dovrebbe ruotare e crescere allo stesso tempo. La rotazione verrà eseguita ogni 2 secondi. La crescita ciclerà ogni 4 secondi. Codice di esempio: .image { position: absolute; top: 50%; left: 50%; width: 120px; height: 120px; margin:-60px …
4
La proprietà Animazione CSS rimane dopo l'animazione
Sto cercando di mantenere una proprietà di animazione CSS dopo il completamento, è possibile? Questo è quello che sto cercando di ottenere ... L'elemento dovrebbe essere nascosto quando l'utente atterra sulla pagina, dopo 3 secondi (o qualsiasi altra cosa), dovrebbe svanire e una volta completata l'animazione dovrebbe rimanere lì. Ecco …
8
Esiste comunque per animare un'ellissi con animazioni CSS?
Sto cercando di avere un'ellissi animata e mi chiedevo se fosse possibile con le animazioni CSS ... Quindi potrebbe essere come Loading... Loading.. Loading. Loading... Loading.. E fondamentalmente continua così. Qualche idea? Modifica: in questo modo: http://playground.magicrising.de/demo/ellipsis.html
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.