Jquery

Jquery ile Yazıyor Efekti

Geçenlerde o blogdan o bloğa dolaşırken açık kaynak kodlu bir jquery eklentisine rastladım. Bu eklenti sayesinde yazılarımıza typing efekti verebiliyoruz. Bugün size bu eklentiyi kullanarak yazıyor efekti oluşturmayı anlatacağım.

Son derece kolay olan bu işlemi yapmadan önce buradan eklenti dosyasını indiriyoruz. Şimdi nasıl kullanacağımıza bakalım…

Önce, indirdiğimiz typed.js dosyasını çağırdık. Daha sonra script tanımlayarak içerisinde element adında class oluşturduk ve hareket etmesini istediğimiz string değerini girdik.

<script src="typed.js"></script>
<script>
  $(function(){
      $(".element").typed({
        strings: ["wordpress, html, css, jquery, php hakkında eğitici makaleler ve dahası... www.aykutt.com"],
        typeSpeed: 0
      });
  });
</script>

Geriye sadece element class’ını çağırmak kaldı.

<div class="element"></div>

Şimdi sayfa ilk yüklendiğinde belirlediğimiz cümleyi yazmaya başlayacaktır. Bunun hızını kendinize göre özelleştirebilirsiniz. Benim yaptığım örneğin demo adresine aşağıdan ulaşabilir ve nasıl göründüğüne bakabilirsiniz. Bir sonraki yazımda görüşmek üzere…

[button color=black size=medium]Demo[/button]

Yazar Hakkında

aykutbasyigit

2008 yılında programlama dillerini öğrenerek sektöre giriş yaptıktan sonra 2012'de fikir değiştirerek yazılımı bırakıp tasarıma yöneldi. Arayüz geliştiricisi olarak çalışmakla birlikte deneyimlerini burada paylaşmakta.

Yorum Yaz