
Cok değil, birkac yıl once sağdaki animasyonun dosya tipinin ne olduğunu sorsalardı SWF veya herhangi bir video formatı olduğunu iddia ederdim.
Gunumuzdeki kod sistemleriyle bu tarz sunumları hazırlamak icin cok fazla caba sarfetmenize gerek yok. Birkac satır JavaScript kodu ve tasarım unsurlarına az da olsa hakim olmanız neredeyse yeterli. Nasıl mı? Hadi derse başlayalım.
Nasıl yapılır?
Kullanacağımız CSS, HTML ve JavaScript kodlarını aşağıdaki duzende sayfanıza yerleştirmeniz gerekmektedir.
Not : Bu tasarım icin jquery-latest.js ve TweenMax.min.js dosyalarına ihtiyac duyarsınız. Ben bu iki JS dosyasını cloudflare ve jQuerynin resmi web sayfasından cekmekteyim.
1. Adım : Yapacağınız ilk iş sayfanızın tagları arasına aşağıdaki kodları eklemek olmalı :
Kod:
2. Adım : HTML Kodlarımızın kalanları ile devam edelim. Aşağıdaki kodları tagları arasına koymalısınız. JavaScript kodlarını da karışıklık yaratmasın diye birlikte sunuyorum.
Kod:
3. Adım : Sırada CSS Kodlarımız var.
Kod:
body #aw-tanim #aw-tanim span
Sonuc
İşlem bu kadar. Yukarıda da belirttiğim gibi bu tasarım jquery-latest.js ve TweenMax.min.js dosyalarına ihtiyac duymakta. İsterseniz bu dosyaları kendi sunucunuza upload edip kullanabilirsiniz.
Bir sonraki makalemde goruşmek uzere.
Kaynak : http://www.adobewordpress.com/js-destegiyle-harika-metin-sunumu/