Web Siteleri için JQuery Tooltip Örnekli Uygulamalar

Web Siteleri için JQuery Tooltip Örnekli Uygulamalar

Web siteleri için çeşitli görsellikler katan tooltip uygulamalarını bir çoğumuz görmüş olabilir ama bir çoğumuzun da hiç bilmediği kesin. Peki bu uygulamalar ne işe yarar? Nasıl kullanılır? Bu uygulamalar birkaç js dosyası, kodu, birkaç imaj ve birkaç css kodundan ibarettir ve uygulama sonrası linklere, resimlere harika görsel efektler katar, bazende site için önemli görevleri üstlenirler..

DİKKAT! Yazı, 2 Nisan 2010 tarihinde yayınlanmıştır ve erişim sağladığınız tarihte güncelliğini yitirmiş olabilir.

VisionWidget.com sitesi 20 adet JQuery Tooltip uygulamasını tek tek tanıtmış ve demo adreslerle uygulamaların web bağlantılarını da eklemiş. Bende linkleri sizin için yazının sonunda paylaştım.

Uygulamaları sitenize uyarlarken images dosyalarını, js dosyalarını ve css dosyalarını sitenize entegre etmeli, daha sonra istediğiniz link veya resimde tooltip uygulamasının görüntülenmesi için class komutu ile tanımlamalısınız.. Burada dikkat edilecek husus sitenize entegre edeceğiniz js dosyaları ve css dosyalarıdır, bazı css kodları sitenizde bozulmalara kaymalara neden olabilirken bazı js dosyaları da daha önce kullandığınız eklentileri pasif hale getirebilir (çakışabilir)..

Tanıtılan siteler arasında 1 numaradaki Tinytips uygulamasını bir WordPress blogumda zamanında uygulamıştım ve çok da güzel olmuştu… İndirdiğim dosyaları ftp alanına attıktan sonra header.php dosyasına js ve css kodlarını ekleyip, ardından da class komutunu linklerde denediğimde sonuç başarılıydı. Fakat css dosyasında var olan H1 (yani büyük punto yazı komutu) çakışma yapıyordu. Neyseki h1 komutunu uygulamanın css dosyasından sildiğimde sorun kalmamıştı..

Bazı linkler patladığı için liste 5 uygulamaya düştü..

VisionWidget.com da tanıtılan (çalışan) 5 Tooltip uygulaması:

1. TinyTips 
2. Sticky Tooltip 
3. BeautyTips 
4. Prototip 2 
5. jTip

>> Web Tasarım ile Uğraşanlar için Faydalı Bağlantılar