SweetMenu.js

0
374
Görüntülenme

sweet

Buna benzer  olan bir çok web tasarım örneği bulunuyor ama genel olarak sosyal medya ikonları için kullanılır. Bu tarz bir çalışma için eklenti yapmak gerekir miydi hala düşünüyorum. Aslında kodlara bakılınca gereksiz de değil hani. Javascript kodlar içinde alt alta ikonlarımızı sıralıyoruz ve html li etiketlerine sırasına göre ikonlar yerleşiyor. Sadece Css kullanılmadan yapılabilecek bir tasarım örneği olsa bile bilmeyenler için işi en kolay seviyesine indirgemiş olan bir uygulama. Bu yüzden hakkını yememek lazım. Hem kodlardan tasarruf hem de kafa yormaktan tasarruf edilmiş.

Css ile bu şekilde sırasına göre ikonları yerleştirmek mümkün :nth-child(1) şeklinde kullanarak. Hem bu işi öğrenmeye çalışan kaç kişi   :nth-child(1)  özelliğini ezbere yazabilir yada biliyor olabilir ki ? Bu yüzden web tasarım işi ile uğraşan kişiler herzaman geliştiricilere ihtiyaç duyarlar. Bu tarz çalışmaları yapıp ücretsiz dağıtan geliştiriciler olmasaydı inanın bu günkü bildiğimiz internet bu seviyede olmazdı. Bu yüzden SweetMenu uygulamasının hakkını da yememek lazım.

Adam Becker yapmış bu eklenti ile oluşturacağımız menüler web sitenin en solunda sabit bir şekilde duruyorlar. Mouse ile ikonların üzerine geldiğinizde link butonu sağa doğru kayıyor. Bu kayma işleminde easeOutBounce kullanıldığı için geri tepme gibi bir animasyona sahip.

Kullanım : 

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

Js dosya adresleri : 

Stil : 

 JavaScript : 

  •  Body etiketleri arasına eklenmesi gereken bölüm.
Html : 

 

CEVAP VER

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