Forum'da ara:
Ara


Yazar Mesaj
Mesaj14.12.2008, 09:19 (UTC)    
Mesaj konusu: CSS ile animasyon yapılır mı?

Canlandırmalar normal olarak, sayfada statik şekiller olarak gözükür ama senin onların karşısında fareni hareket ettirdiğin zaman yaşama sıçrayacaktır.

Bu, birçok ciddi uygulamada eğlence için adile ek olarak kullanılabilir.
Bu makaleyle ben, sana temel bir canlandırmayı biçimlendirmenin nasıl olduğunu (Ve hem de ilgili metinle aynı canlandırmayı oluşturan arttırılan bir uyarlama) göstereceğim
Canlandırmalar %100 css'dir.Java Scprit kullanılmamıştır.
Bu makale için ben, Eadweard Muybridge tarafından çekilen kullanmak için elverişli resimler olduğunu düşündüm.Kendisi hareketli şekilede fotograf çekiminin öncüsü olarak kabul edilebilir.
Her resim 69kB jpg dosyasıdır.

Resim:



Bu genel bir resimdi.Biz bunları ayrı ayrı olarak kullanacağız.














Dosya boyutu giflerden çok daha küçük olacaktır.Ayrıca ziyaretçileriniz resmi diledikleri gibi oynatabileceklerdir.
[img]http://www.webreference.com/programming/css_animation/images/ani_gallop.gif[/iimg
Bu resim 108 kb dir.Css yoluyla ise 60 kb.


Şuan yanlızca bilgi verdim.Bu ilk dersimizdi.Diğer dersleri de zamanla paylaşacağım ve birikte yapacağız.
______________
Mesaj14.12.2008, 14:29 (UTC)    
Mesaj konusu:

Ben burda Css ile yapılmış bişey göremedim Very Happy
______________
http://webninjasi.tr.gg
Mesaj26.12.2008, 16:52 (UTC)    
Mesaj konusu:

Bunu konuya giriş olarak yazdım.Yeni ders en kısa zamanda sizlerle
______________
Mesaj27.12.2008, 08:56 (UTC)    
Mesaj konusu:

2. Ders
İlk olarak ve en önemli olan DOCTYPE, senin, doğru (X) HTML'e sahip olduğuna emin olur! Tarayıcıların bu çoğu olmadan uyumsuzluk problemlerinin bütün türlerine götürecek olan 'Gariplikler' biçimine atılacak. W3C QA — listeler, geçerli DTDs'ten, kullanılabilen geçerli DOCTYPES'in bir listesi var. XHTML1'den seç. 0 veya XHTML1. 1 bunlar olarak, bu biçimlendirme için daha uygundur. Ben, XHTML1'i kullanırım.
Şekiller fare üzerine getitildiğinde hareket etmeye başlar.

HTML'in bundan itibaren, on bir resimi canlandırdığı (Twelth şekli, ilk durağan şekil olacak)ı tutması için basit bir divi kullanabiliriz. Biz bir kez daha, bağlantılarda şekilleri öyle çevirmeye ihtiyaç duyacağız ki Internet kaşifi, kullanabilir : pseudo sınıfı havada durabilir.
(X), HTML'in, örneği:

Kod:
<div id="film" title="Flick animation">
<a id="f1" href="#nogo"><img src="../images/f1.jpg" title="frame 1" alt="frame 1" /><b>FRAME 1</b></a>
<a id="f2" href="#nogo"><img src="../images/f2.jpg" title="frame 2" alt="frame 2" /><b>FRAME 2</b></a>
<a id="f3" href="#nogo"><img src="../images/f3.jpg" title="frame 3" alt="frame 3" /><b>FRAME 3</b></a>
<a id="f4" href="#nogo"><img src="../images/f4.jpg" title="frame 4" alt="frame 4" /><b>FRAME 4</b></a>
<a id="f5" href="#nogo"><img src="../images/f5.jpg" title="frame 5" alt="frame 5" /><b>FRAME 5</b></a>
<a id="f6" href="#nogo"><img src="../images/f6.jpg" title="frame 6" alt="frame 6" /><b>FRAME 6</b></a>
<a id="f7" href="#nogo"><img src="../images/f7.jpg" title="frame 7" alt="frame 7" /><b>FRAME 7</b></a>
<a id="f8" href="#nogo"><img src="../images/f8.jpg" title="frame 8" alt="frame 8" /><b>FRAME 8</b></a>
<a id="f9" href="#nogo"><img src="../images/f9.jpg" title="frame 9" alt="frame 9" /><b>FRAME 9</b></a>
<a id="f10" href="#nogo"><img src="../images/f10.jpg" title="frame 10" alt="frame 10" /><b>FRAME 10</b></a>
<a id="f11" href="#nogo"><img src="../images/f11.jpg" title="frame 11" alt="frame 11" /><b>FRAME 11</b></a>
</div>

______________
Önceki mesajları göster:   


Powered by phpBB © 2001, 2005 phpBB Group
Türkçe Çeviri: phpBB Türkiye & Erdem Çorapçıoğlu