Türk Yapımı “Noty” Bilgilendirme Çubuğu

Daha önce kapatılabilir şeffaf bir bilgilendirme çubuğu paylaşmıştım.Bir arkadaşımın isteği üzerine yine buna benzer bir bilgilendirme çubuğu ararken Nedim Arabacı tarafından geliştirilmiş Noty ile karşılaştım ve sizlerle de paylaşmak istedim.

 

 

Bu kapatılabilir bilgilendirme çubuğu pat diye değil bir efekt ile açılıyor ve köşesindeki X ikonuna basılmadığı takdirde belli bir süre sonra kendiliğinden kapanıyor.Blogunuza nasıl ekleyeceğinize gelirsek…

 

1.Adım: Şablonunuzdan </head> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="http://yourjavascript.com/61925244214/jquery-noty.js"></script>

<link rel="stylesheet" type="text/css" href="https://drive.google.com/file/d/0BxxMpDce-fNUQjl0cjd5ZXZfbWc"/>
<link rel="stylesheet" type="text/css" href="https://drive.google.com/file/d/0BxxMpDce-fNUd1Y1NlVqd1QtV0U"/>

 

2.Adım: Şablonunuzdan bu kez </body> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

<script type="text/javascript">
noty({"text":"Blog Hocam'ı Twitter'da takip edin! <a href='http://twitter.com/bloghocam' target='_blank'>@BlogHocam</a>","layout":"bottom","type":"success","textAlign":"center","easing":"swing","animateOpen":{"height":"toggle"},"animateClose":{"height":"toggle"},"speed":750,"timeout":10000,"closable":true,"closeOnSelfClick":false});
</script>

 

Bu çubuğu sayfanın 3 farklı yernde gösterebilirsiniz.Çubuğun sayfanın üst kısmında gözükmesini istiyorsanız bottom yazan yeri top ,  ortada bir pencere şeklinde açılmasını istiyorsanız center olarak değiştirebilirsiniz.

 

Nedim Arabacı’ya böyle bir uygulama geliştirip bizlerle paylaştığı için bir kez daha teşekkür ediyorum.http://needim.github.com/noty/#creator sayfasına gidip bu uygulamadan yararlanarak farklı tarzda çubuklar da oluşturabilirsiniz.