Ring – Rotating vertical

0
211
views

ringmenu

Saf Css3  kullanılarak hazırlanmış  olan bir menü örneği.  Menü örneği ilk bakışta sadece orta kısımda bulunan kategori ikonunun içinde olduğu daire şekli görünüyor. Mouse ile dairenin içine girildiği an diğer görünmeyen dört daire dönerek ve büyüyerek orta dairenin etrafını çevreliyor.

Görünüş olarak fazla yer kaplamayan bu menü örneğine Font Awesome yardımıyla rastgele bir kaç çeşit ikon ekledim. Menüye bakıldığında bir arkadaşlık sitesine ait kategoriler görünüyor. Daha fazla ikon seçeneğine buradan ulaşabilirsiniz. İkonları değiştirmek için tek yapmanız gereken menü html kodları içinde  bulunan span class=”icon-list” kısmına ikon adı eklemek.  Icon-list Font Awesome üzerinde kategori ikonunu gösteriyor. Bunu icon-facebook yada icon twitter olarak değiştirmeniz menü örneğini sosyal ağlar için kullanılabilir bir menüye dönüştürmenize yarar.

 

Kullanım

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

Font Awesome adresi :

Css :

  •  Body etiketleri arasına eklemeniz gereken bölüm.

Html : 

 

 

 

 

CEVAP VER

Please enter your comment!
Please enter your name here