Perşembe , 19 Ekim 2017
Anasayfa » JavaScript » JavaScript Tooltip Yapımı

JavaScript Tooltip Yapımı

Bu yazıda sadece javascript kullanarak tooltip yapımı anlatacağım. Internette sıklıkla jquery tooltip kullanımı görmüşsünüzdür.  Jquery kullanmadan HTML data-* özelliği kullanarak tooltip oluşturacağız.

DEMO

Nasıl Çalışır: Tooltipin nesnesinin gösterileceği etikete data-tooltip attribute ile ekranda gösterilecek değer girilir. Yazdığımız javascript kodu ile sayfada data-tooltip niteliği(attribute) olan bütün etiketler tooltip olarak ekranda görünecektir. Bu kısımda CSS tanımlaması tooltip nesnesinin daha güzel görünmesi için faydalı olacaktır.

 

JavaScript kodu:

 

Çalışmanın kodlarını toparlayıp bir örnek üzerinde açıklayacak olursak şu şekilde oluşacaktır.

 

Hakkında Hayri

İlginizi Çekebilir

JavaScript for … of Kullanımı

for of deyimi tekrar eden (iterable) nesneler üzerinde hareket ederek nesnenin değerini okumak için kullanılan …

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir