Tiptip.js – 230 tane ikon

0
267
Görüntülenme

web-ikonları
Font Awesome’yi sanırım duymayan çok az kişi vardır. Font Awesome sayesinde photoshop bilgisi olmadan websitemize  dilediğimiz  türden ikonları kolaylıkla ekleyebiliyoruz. Aklınıza gelebilecek her türlü ikon çeşidi olmasa da bir websitesi için gerekli olan birçok ikon çeşidi bulunuyor.  230 tane Google+ ikon örneği de aynı amaçla Web tasarımcılara kolaylık olsun diye hazırlanmış. Font Awesome ikonik fontlardan oluşuyor ama bu lis

tedeki ikonların tamamı png  formatında  hazırlanmış olup Css sprite tekniği ile websayfasına yükleniyor. İki adet png formatıyla hazırlanmış olan bu ikonların bir tane png resmi gri renkli diğer png resim ise renkli olarak hazırlanmış. Mouse ikonların üzerine geldiğinde renk değiştirmelerini sağlıyor buda. İkonların yanında bir de budon olarak kullanma özelliği de var. Her ikon ve buton için ayrı ayrı sınıflar belirlenmiş.

Bir ikon kullanmanız için class=”icon icon1″ ve buton kullanmanız için de class=”icon icon108″ şeklinde elementlere belirli sınıflar eklemeniz gerekiyor. Mouse ile demo sayfasındaki örneklerin üzerinde gezdiğiniz zaman her ikonun sınıfını görebilirsiniz.

Kullanım

  • Head etiketleri arasına eklemeniz gereken bölümler.

Js ve stil dosyaları : 

 Javascript : 

Body etiketleri arasına eklemeniz içinde bütün ikonları incelemenizi tavsiye ederim. Ayrıca download butonundan indirdiğiniz dosyada hazır kurulu bir halde olan index.html dosyasını da göreceksiniz.

 

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
Önceki İçerikFlickr ImageGallery
Sonraki İçerikAvgrund
1983 doğumlu, olmayan bir çocuk babası, espirili ve kendini cana yakın zanneden biri işte. Daha ne olsun ?
Paylaş

CEVAP VER

Lütfen yorumunuzu yazın.
Lütfen İsminizi bu alana yazın.