Cumartesi , 21 Ocak 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 HTML DOM Nesneleri

HTML DOM ile, javaScript kullanarak bir HTML belgesinin tüm elementlerine ulaşıp, değiştirebilirsiniz.  DOM; HTML, SVG, …

Bir Cevap Yazın

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

Wordpress Tema indir