javascript - Voinko tilapäisesti poistaa käytöstä kaikki CSS3-siirtymät/animaatiot samalla kun elementti rakennetaan?
Olen luonut melko monimutkaisen valikon verkkosivustolle. Valikko perustuu valtavaan määrään animaatioita, jotka on tehty CSS3:lla. Kuitenkin, kun siirryn toiselle sivulle, valikon tulisi muodostua aluksi - ja ilman kaikkia animaatioita, mutta tehtynä JS:llä eikä palvelinpuolella.
Nyt pohdiskelen, miten voisin tilapäisesti poistaa kaikki siirtymät/animaatiot käytöstä, kunnes valikko on rakennettu.
Ajattelin luoda aliluokan, joka ylikirjoittaa animaatiot, mutta se ei tunnu toimivan, koska aina käytetään perusluokassa määriteltyä animaatiota/siirtymää?
Vastaus #1
Ehdottaisin animaatioidesi/siirtymiesi soveltamista luokan kautta, joka lisätään JavaScriptillä sen jälkeen, kun valikko on rakennettu.
On olemassa animation-play-state-ominaisuus, joka voi pysäyttää animaatioita, mutta se ilmestyi vasta (etuliitteellä) Safarissa 5 ja Chromessa 4 (toisin kuin muiden animaatio-ominaisuuksien kohdalla Safarissa 4 ja Chromessa 2), enkä ole varma, toimisiko se tarpeisiisi.
Vastaus #2
Voisit asettaa transition-duration-arvoksi 0s rakentaessasi valikkoa ja sitten asettaa sen takaisin haluttuun arvoon myöhemmin.