Eienskap transition-duration

Die eienskap transition-duration stel die tyd vas om die vloeiende oorgang transition uit te voer.

Sintaksis

cssselektor {
  transition-duration: tyd in s of ms;
}

Waardes

Waarde	Beskrywing
`s`	Stel die tyd in sekondes vas (byvoorbeeld `3s`). Kan desimale waardes spesifiseer, byvoorbeeld, `0.5s` - 'n halwe sekonde.
`ms`	Stel die tyd in millisekondes vas (byvoorbeeld `3ms`). Een sekonde is `1000` millisekondes.

Verstekwaarde: 0s.

Voorbeeld

Beweeg jou muis oor die blok - dit sal sy wydte geleidelijk verander oor 2 sekondes.

html<div id="elem"></div>

css#elem {
  transition-duration: 2s;
  transition-property: width;
  border: 1px solid black;
  height: 50px;
  width: 100px;
}
#elem:hover {
  width: 400px;
}

Результат:

Sien ook

die eienskap transition-property,
wat die naam van die eienskap vir die vloeiende oorgang spesifiseer
die eienskap transition-delay,
wat die vertraging voor die vloeiende oorgang spesifiseer
die eienskap transition-timing-function,
wat die tydsfunksie vir die vloeiende oorgang spesifiseer
die eienskap transition,
wat die afkorting vir die vloeiende oorgang is
die eienskap animation,
wat gebruik kan word om animasies te skep