JQuery Colortip Tooltip Eklentisi

Enes Pekkaya    Javascript, JQuery     Javascript, JQuery

Nette dolaşırken önüme gerçekten çok güzel bir tooltip kütüphanesi geldi. Bunu yapan arkadaş gerçekten çok güzel bir iş çıkarmış. 6 farklı renk seçeneği bulunmaktadır. Haliyle kullanımıda oldukça basit. Yapmanız gereken tek şey a taginin içine “title” attribute ini eklemek. İşte bu kadar.

Yapılması gerekenler;

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="colortip-1.0/colortip-1.0-jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

 $('[title]').colorTip({color:'black'});

});
</script>

İlk olarak ilgili javascript kütüphanelerini ekliyoruz. Son olarak title attribute ‘u olan a taglarine tooltip ekliyoruz.

<a href="http://www.enespekkaya.com/" title="S. Enes Pekkaya'nın Blogu">Enes Pekkaya</a>

Yukarıdaki gibi a tagini yazınca işlemimiz tamamdır. Eğer siz bir sayfa içerisinde farklı renklerde tooltip uygulamak isterseniz, a taginin içerisine class=”yellow” attribute’ını yazmanız.

Web sitesi : http://tutorialzine.com/2010/07/colortips-jquery-tooltip-plugin/

Demo : http://demo.tutorialzine.com/2010/07/colortips-jquery-tooltip-plugin/colortips.html

İndirmek için tıklayınız.