CSS

Css3 Animasyonlu Buton Menü Yapımı Örnekleri

Merhaba arkadaşlar. Menüler ve çeşitli animasyonlu butonlar websitelerimize çoğu zaman daha şık ve daha canlı anlamlar katabiliyor çoğu zaman. özellikle css3 ve html5 in de duyrulmasından sonra yeni tarz html5 sitelerdeki animasyonlu bölümlerle  bir zamanların vazgeçilmezi flash bile tarihe gömüldü neredeyse. Hatırlasınız flash ile yapılan siteleri açılması bir dert kurulması bir dertti ama hakkını yememek lazım animasyonlarıyla effectleriyle biz webmaster lara çok ekmek yedirdi 🙂 aşağıda sizlere kendi yaptığım ve Başka arkadaşların yaptığı çalışmaların rastladığım animasyonlu web öğelerinden seçmeler sunacağım umarım beğenirsiniz.

Aşağıda kodlarıyla ve önizlemesiyle verdiğim buton örneklerini çeşitlendirerek web sitelerinizde kullanabilirsiniz.

onizleme-buyuk-

Aşağıdaki Css3 Animasyonlu buton örneğimizdeki dikkat çekiciliği görmemek mümkün değil değilmi 🙂 Burada Css3 ün animation özelliği kullanılarak sadece css ile yapılan bu animasyon için flash’ta yapabileceklerimizi düşündünüzmü hiç. nereden nereye değilmi 🙂

onizleme-buyuk-

Aşağıdaki Örnekte css3 ile yapıtığım açılır menü örneğini göreceksiniz.

onizleme-buyuk-

css3 ile yapılmış olan, Aşağıdaki Üye giriş butonlarını çok seveceksiniz. Yapan arkadaşın eline sağlık…

onizleme-buyuk-

Yine aşağıda Beğendiğim bir css3 buton örneğini daha paylaşmak istiyorum. yapan arkadaşın eline sağlık.

onizleme-buyuk-

Aşağıdaki Css3 Jquery uygulamamızı sosyal medya sitelerinden hatırlayacaksınız. pinterest, linkedin, tumblr gibi sistemler masonary eklentisini kullanmakta. ama bu örneğimiz tam olarak masonary değil sadece dizayn ve görünüm olarak benziyor, ama bunda daha çok css3 desteği alınmış.

onizleme-buyuk-

[quote]NOT:Yukardaki css kodlarımızı Bir önceki makalem olan “CSS’i Web Dökümanlarında Kullanma” Adlı css dersimden faydalanarak kendi projelerinizde kullanabilirsiniz.[/quote]

Şimdilik bu kadar arkadaşlar bundan sonraki paylaşımlarımı hafta da bir mutlaka yapacağım. Css konusunda sorularınızı her zaman iletebilirsiniz. konu altında soracağınız soruları gün içerisinde mutlaka içerisinde cevaplamış olurum…

İlgili Makaleler

Bir Yorum

  1. çok güzel buton örnekleri var kullanabilirim bunları teşekkürler emekleriniz için.

Bir cevap yazın

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

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Başa dön tuşu