transition-duration касиети

transition-duration касиети transition жумшалмалуу өтүүсүнүн аткарылуу убакытын белгилейт.

Синтаксис

селектор {
	transition-duration: убакыт s же ms менен;
}

Маанилер

Маани	Сүрөттөмө
`s`	Убакытты секунд менен белгилейт (мисалы `3s`). Бөлчөк маанилерди да белгилөөгө болот, мисалы, `0.5s` - жарым секунд.
`ms`	Убакытты миллисекунд менен белгилейт (мисалы `3ms`). Бир секунд - бул `1000` миллисекунд.

Демейки маани: 0s.

Мисал

Блокко чычкан курсорун алып келгиле - ал 2 секунд ичинде туурасын жумшак өзгөртөт.

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

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

Ошондой эле караңыз

transition-property касиети,
жумшалмалуу өтүү үчүн касиеттин атын белгилейт
transition-delay касиети,
жумшалмалуу өтүүдөн мурун күтүү убакытын белгилейт
transition-timing-function касиети,
жумшалмалуу өтүү үчүн убакыт функциясын белгилейт
transition касиети,
жумшалмалуу өтүү үчүн кыскартылган жол
animation касиети,
анын жардамы менен анимация түзүүгө болот