Slayt akordeon

2
303
views

akordeon

Aslında yazının başlığı saf Css3 akordiyon  örneği olacaktı ama üzülerek söylüyorum 124 bitlik bir resim yüzünden bu akordiyon örneği saf kelimesini haketmiyor.  Resim başlıklarının arkaplanında şeffaf  bir  bölüm oluşturmak istedim ama bunun sonucunda resim başlıklarıda ister istemez  şeffaf  bir hal alıyordu. Ya  çok fazla  satır ekleyecektim html kodlar  içine yada 124 bitlik bir  resim ekleyecektim. Bana göre resim eklemek  daha mantıklı geldi. Pekte  bir yer tuttuğu yok aslında. (Artık resim hiç yer tutmuyor çünkü yanlışlıkla 124 bitlik resmi sildim 🙂 Ama daha güzel bir  görünüm ortaya çıktı.)

İlk bakışta  bütün resimlerin %20’lik  bir bölümü görünüyor mouse  ile herhangi bir resmin üzerine geldiğinizde %20’lik oran %80’e çıkıyor.  Bazı akordiyon örneklerinde  resim başlıklarını yan  kullanabilmek için photoshop yada benzeri bir program yardımı  ile  resimlerin üzerine dikey  yazı  yazmak  zorunda  kaldığınız  durumlar  olurdu  bu yüzden  resimlerin  olduğu çerçeveye  css  rotate kullanarak  bu yüküde üstünüzden kaldırdım. İE hariç diğer  tarayıcılarda sorunsuz  bir şekilde  çalışıyor.  İllaki  İE üzerindede  çalışsın diyorsanız  buradan jQuery rotate eklentisini  inceleyerek  iE üzerinden  jQuery ile nasıl yapabileceğinizi  öğrenebilirsiniz. Yada İE tarayıcılarında  çalışan bir  rotate filtresini  buradan inceleyebilirsiniz.

 

Kullanım

  • Head etiketleri arasına eklemeni gereken bölüm.

Css : 

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

Html : 

 

Aranan kelimeler:

  • akordeon sayfa tasarimi
  • akordeon slayt
1 oy (1 votes, average: 5,00 out of 5)
Loading...
Önceki İçerikFlip-Images
Sonraki İçerikAçma kapama düğmesi tarzı onay kutuları
1983 doğumlu, olmayan bir çocuk babası, espirili ve kendini cana yakın zanneden biri işte. Daha ne olsun ?
Paylaş

2 YORUMLAR

CEVAP VER

Please enter your comment!
Please enter your name here