.ilgili-element-sinifi { transition: [özellikleri] [süresi] [zamanlama fonksiyonu] [gecikme zamanı]; }İlgili elementin üzerine gelince 0.4 saniye gecikmeli olarak toplamda 6 saniyede yazı rengi değişimi olacaktır.
Örnek 1 CSS
a { padding:5px; background:red; color:white; font-size:20px; transition-property:color; transition-delay:0.4s; 0.4. saniyeden itibaren başla transition-duration:6s; 6 saniyede olayı tamamla } a:hover { color:black; }Örnek 1 HTML
<a>Link<a>Örnek 1
İlgili elementin üzerine gelince 1sn gecikmeli olarak genişlik ve yükseklik değişimi olacaktır. Elementi mouse terk edince eski haline 1sn gecikmeli olarak geri dönecektir.
Örnek 2 Kod
.css3-transitions-ornek2 { background:red; width:200px; height:40px; color:#fff; padding:3px; font-family:'Arial'; transition-property:width;Geçişin width üzerinde olmasını belirtiyoruz transition:1s ease; } .css3-transitions-ornek2:hover { width:250px; transition:1s ease; }Örnek 2
www.ontedi.com