css-Frame
css-Frame

web sayfalarında animasyon denince akla ilk flash movie clip’ler yada hazır swf dosyaları gif ve benzeri dosyalarla hazırlanmış tasarımlar gelir… oysa yeni nesil kodlamalarla tasarıma kodla şekil vermek de mümkün olsa gerek mesela flash frame kullanmadan css kodları ile bir sahne oluşturup bu sahnelerin herbirinde farklı şeyler gösterebildiğinizi bir düşünün…Css ile Animasyon’a giriş
1- CSS Transitions

css-transition
css-transition

css transitions(css ile şekil değişiklikleri) anlamına gelen bu yöntemle herhangi bir katman div ya da bir çerçevenin boyutlarını , arkaplan rengini , yazı tipini ve konumlarını mouse hareketlerine göre değiştirebilirsiniz…2- Keyframes

css-keyFrame
css-keyFrame

Keyframe‘ler ile animasyonunuzun başlangıç ve bitiş sahnelerini ve zaman akışını ayarlaya bilirsiniz işte bir kaç örnek kod:

@keyframes ‘wobble’ { 0 { left: 100px; } 40% { left: 150px; } 60% { left: 75px; } 100% { left: 100px; } }

Yazının devamı için buraya bakabilirsiniz.Not :bu sadece css’ye eklenmesi icin hazirlanmis bir teklif. bu yuzden pek fazla örnek yok. eminim ,ilgilenen arkadaşlar pek yakında benzer örnekleri kodlamaya başlayacaklardır…

css-animasyon
css-animasyon

Bu Konuda bulabildiğim bir kaç örnek:
– CSS Transformation Examples– CSS Transforms– CSS Transforms, Transitions, and Web Fontsburayı tıklayarak css ve Font’lar ile ilgili Basit bir örnek indirebilisiniz.css’in animasyon olarak kullanılmasının ve Yazı tipleri , frameler gibi farklı yönlerinin yaygınlaşmasını bekliyorum…