bildirgec.org

css menüler hakkında tüm yazılar

Gelişmiş CSS Hileleri

mglass | 02 October 2009 14:10

gelişmiş css hileleri
gelişmiş css hileleri

websayfalarının vazgeçilmezleri haline gelen CSS menuler , javascript galeriler , jQuery eklentilerivs. derken bütün bunlara görsel güzellikleri verebilmemizi sağlayan CSS TRİCKs yani css hilerleri giderek uzmanlaşıyor…

gelişmiş css menu
gelişmiş css menu

işte websitenizde kullanabileceğiniz bir kaç css menu hilesi ya da hüneri ben buna css’in marifetleri diyorum… 😉

gelişmiş css efeklerle iletişim menusü
gelişmiş css efeklerle iletişim menusü

Kaynak , CSS ve XHTML kodları için tılayınız
Örnek uygulamayı incelemek için buraya bakabilirsiniz.

30 Olağanüstü Css Menü Tekniği

LeBron | 19 April 2009 12:48

Burada web sitelerinizde kullanabileceğiniz en iyi menü örneklerini bulabilirsiniz. Css‘in yetenekleri ile birbirinden güzel çalışmalar ortaya çıkmaktadır.

Bu yazı size mükemmel menü tekniklerini öğretebilecek ve çok iyi bir kaynak olacaktır.

1 – The menu menu

Bu, farklı büyük bir menü örneğidir. Menünün üzerine geldiğiniz zaman hemen yanında alt menüler görünüyor.

2 – Pure CSS hover menu

bu css tekniği ile dikey alt menüyü görebileceksiniz.

10 Mükemmel Çoklu Seviye Menü Tekniği

pinkfloyd | 15 March 2009 15:26

Web geliştiricileri kullanıcı dostu dikey ve yatay gezinti (navigasyon) menülerini CSS kullanarak oluşturabiliyorlar. JavaScript sayesinde de bu menüler daha etkileşimli, yanıt veren ve değişken hale geliyorlar.

Bugünkü yazıda jQuery, mooTools gibi JavaScript kütüphanelerinin yanısıra CSS ile oluşturulmuş 10 mükemmel çoklu seviye gezinti menüsü tekniğine yer vereceğiz.

1. Vimeo Benzeri Navigasyon Oluşturmak

Vimeo.com üzerindeki menünün neredeyse aynısı Janko tarafından geliştirilmiş durumda. Bu menünün en güzel tarafı menü öğesi üzerine fare imleci getirildiğinde menünün beliriyor olması. Ayrıca menünün sunduğu farklı arama seçenekleri sayesinde menü elementlerini eleyebiliyorsunuz.

Bu rehberin temelinde sırasız listeye dayalı CSS tabanlı bir açılır menü yatmaktadır. Menünün yapısı aşağıdaki görsel üzerinde açıklanmış.

Sizin de göreceğiniz üzere UL elementinin dört öğesi bulunuyor. Bunlardan ilki kısa bir alt menü içeren logo. Ardından giriş bağlantısı, alt menü içeren yardım bağlantısı ve yine alt menü çeren arama öğesi yer alıyor. Her bir alt menü, dahili olduğu menü elementinin üzerine fare imleci götürüldüğünde beliriyor.

101 css tekniği bölüm 1

mglass | 14 June 2008 22:02

css web Tasarımını hızla değiştirmeye devam ederken, geçen hafta yazmış yolduğum onlarsız yapamadığımız 53 css tekniği başlıklı yazımın çok tutulması sebebiyle bu konuda daha derin bir kaynak araştırması yapma gereği duydum, eminim bu yazıyı tutan bir çok arkadaş elinin altında böylesine önemli ve işe yarar css örnekleriyle dolu bir kaynağın bulunmasından çok hoşnut olmuşlardır bunları bu şekilde listeleyip bildirgec‘e yazmamın asıl amacı , bulduğum döküman tarzı kaynakların sıkkullanılanlar listemde kaybolup gitmesidir… Neyse fazla uzatmadan CSS Tekniklerine kaldığımız yerden devam edelim…
işte Her zaman Kullanılacak 101 Css Tekniği…
101 – 1:web sitenizin kısa haber köşelerinde css Cinleri oluşturmak.

Css Cinleri - (css sprites)
Css Cinleri – (css sprites)

101 – 2: Css ile Kıvrımlı Köşeler oluşturmak

Css kıvrımlı köşeler
Css kıvrımlı köşeler

bu uygulamanın demosu için burayabakabilirsiniz.
101 – 3:Resim Yenileme tekniği

resim yenileme tekniği
resim yenileme tekniği

bu tekniğin açıklaması için Dave Shea‘nin yazdığı şu makale‘ye bakabilirsiniz.
101 – 4:CSS ile Geçişli Kapılar oluşturmak

css sliding doors tekniği
css sliding doors tekniği

101 – 5: Css ile Rounded Box oluşturmak
benim en çok hoşuma giden uygulama bu oldu. kaynak koduna da aynı sayfadan ulaşılabilmesi çok iyi.

css rounded box
css rounded box

evet yazımın diğer örneklerine buradan ulaşabilirsiniz . Siz bunları incelerken ben 2.Bölüm için hazırlıklarımı yapıyor olacağım yorumlarınız için şimdiden teşekkürler umarım beğenirsiniz…