Awesome stickey footer

Hatırlayanlar bilirler  bir  zamanlar  Facebook  kullandı  diye  bir çok  sitede  kullanılmaya  başlayan ve en çok  arattırılan menü örneklerinden biri  olan footerde(sayfanın en altı)  sabit  duran menü örneği. Genelde  jQuery yada javascript  olarak oluşturuluan bu örneğin bir de bütün tarayıcılarda  çalışan Css3 sürümü mevcut. Sadece İnternet  Explorer  ve Google Cherome tarayıcılarında  denedim.

İnternet  explorerde çalışıyorsa  diğer  bütün tarayıcılarda  çalışıyordur anlamına  geliyor bence. Bu  sözden kastım İE’nin dandik  bir  tarayıcı  olduğu  değil  aslında. Bana  göre  tarayıcı  şirketleri  bir  inattır  tutturmuş  gidiyorlar hepsinin amacı  sanki  bir  olup İE’yi batırmak gibi. Bu kesin bir sonuç  değil  sadece benim izlenimlerim. Belkide  gerçekten böyledir  durum.  Mesela  Safari  ve Cherome’nin birlikte  hazırladığı  Css3 versiyonu  gibi. Yayınlanır yayınlanmaz  İE  hariç  bütün tarayıcılar  tarafından desteklenmeye başlayan bu özellik İE tarafından sanki  kabul edilmemiş gibi  görünüyordu başlarda.  Biraz inat yapıyordu sanki. Çünkü İE’nin geliştirdiği Css3’e benzeyen bir yapı zaten vardı  ve sadece İE  tarafından destekleniyordu. Microsoft Filter olarak adlandırılan bu özellik JavaScript’in  biraz  basitleştirilmiş hali bazı  örnekleri Css içerisinde  kullanırken bazı  özellikleri Csss  içerisinde  kullanılamıyordu. Sen benimkini  kabul etmiyorsan ben  seninkini hiç kabul etmem  misali ta ki İE9 ve İE10 versiyonları piyasaya  çıkana  kadar.   İE10  versiyonunu kullanamadım (çünkü kullanabilmek için bilgisayarınızda Windows8 yüklü olması  gerekiyor) ama  söylenenlere  göre  hemen hemen bütün Css3 özelliklerini  destekliyor.

Kullanım

Css url  adresi : 

<link href="style.css" rel="stylesheet" type="text/css" />

Html : 

<div id="stickey_footer">
  <ul id="footer_menu">
    <!-- Begin Footer Menu -->
    <li class="imgmenu"><a href="#"><span>Home</span></a></li>
    <li><a href="#">Ara&ccedil;lar</a>
    <li><a href="#">Portfolio</a>
    <li><a href="#">Arkada&#351;lar</a>
    <li><a href="#">Blog</a>
    <li><a href="#">G&ouml;r&uuml;&#351;ler</a>
    <li><a href="#">&#304;leti&#351;im</a>
  </ul>

  <ul id="social_icons">
    <!-- Social Icons -->
    <!-- The span is the text appearing on hover, use the tooltip class in the link -->
    <li><a href="#" ><img src='images/twitter.png' alt="" /><span>Twitter</span></a></li>
    <li><a href="#" ><img src='images/digg.png' alt="" /><span>Digg</span></a></li>
    <li><a href="#" ><img src='images/flickr.png' alt="" /><span>Flickr</span></a></li>
    <li><a href="#" ><img src='images/facebook.png' alt="" /><span>Facebook</span></a></li>
  </ul>

</div>