Css 3 ile geçiş efektleri konusunda örnekler verip anlatırken webmasterler tarafından en çok kullanılan terimlerin hangi anlama geldiği konusunda ufak bilgiler vererek örneğimize başlamak istiyorum. 

Bu terimlerden;

Translate: Hangi nesne için kullanılacaksa o nesneyi kaydırmak ve konumunu değiştirmek için kullanılmaktadır. 

Scale: Uygulanan nesnenin boyutunu  değiştirmek için kullanılmaktadır. 

Transform: Dönüşüm anlamında kullanılmaktadır.

Rotate: Nesneyi döndürmek için kulanılmaktadır.




Css3 ile solma efektinde; 300x200 ebadında iki ayrı şehir görselimiz bulunmaktadır. Fare ile üsteki görselimizin üzerine gelince üsteki görselimizin kaybolduğunu ve altında bulunan görselimizin meydana çıktığı görülmektedir.

Örneğimizde position:absolute ve left:0 ile görselimizi konumlandırdık ve opacitiy ile de solma efekti uygulayarak altda bulunan görselimizi gösterdik.

Bu tür efektler ekseri resim galerilerinde kullanılmaktadır. Fare ile üzerine gelindiğinde üste bulunan resim solma efekti ile yerini alta da ki resme bırakmakta veya resimle ilgili detaylı bilgi görüntülenmektedir.

Aşağıdaki örneğimizde fare ile üzerine gelerek solma, yakınlaştırma ve uzaklaştırma, rotasyon efektlerini görüntüleyerek deneyebilirsiniz.