Skip to content

CSS: transition

.instui-transition.-transition-fade-entering — Dosbarthiadau cyflwr animeiddio ar gyfer y cydran Transition.instui-transition a dosbarthiadau cyflwr (-transition-fade-entering, -transition-scale-exited, ac ati) — defnyddadwy'n syml neu wedi'u cadwyni ar unrhyw gydran.

Source: transition.css

Defnydd

css
@import "@pantoken/components/utilities.css";

Enghreifftiau

html
<div class="instui-transition -transition-fade-entering">Animated content</div>

Modyfiwyr

ModyfiwrDisgrifiad
.-transition-*Math o drawsnewid / dosbarth cyflwr sy'n cael ei newid gan yr amser‑rhedeg (fade|scale|slide-* + entering|entered|exiting|exited).
.-transition-fade-entered
.-transition-fade-entering
.-transition-fade-exited
.-transition-fade-exiting
.-transition-scale-entered
.-transition-scale-entering
.-transition-scale-exited
.-transition-scale-exiting
.-transition-slide-down-entered
.-transition-slide-down-entering
.-transition-slide-down-exited
.-transition-slide-down-exiting
.-transition-slide-left-entered
.-transition-slide-left-entering
.-transition-slide-left-exited
.-transition-slide-left-exiting
.-transition-slide-right-entered
.-transition-slide-right-entering
.-transition-slide-right-exited
.-transition-slide-right-exiting
.-transition-slide-up-entered
.-transition-slide-up-entering
.-transition-slide-up-exited
.-transition-slide-up-exiting

Priodweddau arferiad

EiddoMathDiofynDisgrifiad
--duration<time>300msHyd animeiddio (diofyn 300ms); gosodwch fel arall i gyflymu neu arafu pob cyflwr trosglwyddo.
--timing*ease-in-outSwyddogaeth amserlennu animeiddio (diofyn ease-in-out).