ayaSlider

ayaSlider Çoğu slider eklentisinde genelde sağdan sola yada solan sağa kayan resim özelliği bulunur. Bazen kayan resimlerin üstüne, sağına yada soluna başka bir resim, yazı yada başlık eklemek isteriz. Birkaçı bu tarz özellikleri desteklese de  genelinde değişiklik yapmak mümkün olmuyor. Olsa bile beklentilerimizi karşılayacak türden değildir.

jQuery ayaSlider uygulamasında aklınıza gelebilecek bir çok özelliği eklemek mümkün. Her resim arası farklı geçiş süresi, her resmin farklı bölümünde başlık (sağ, sol, üst, alt vs. kendiniz belirliyorsunuz),  her resim için ayrı html elementler, her element için farklı farklı animasyonlar, fade efekti ile açılan resimler, soldan sağa kayan, sağdan sola kayan, üstten düşen resimler  gibi daha sayamadığımız bir çok özelliğe sahip premium niteliğinde ücretsiz  bir  slider.

Mahmoud Mehyar tarafından yapılmış olana ayaSlider gördüğünüz gibi benzerlerinden çok çok üstün özelliklere sahip. Değişik alanlarda yayınlar yapan birçok web sitesi için kullanılabilir. Haber, moda, sağlık, kişisel bloglar, teknoloji siteleri, foto blogcular ve aklınıza gelebilecek diğer tüm web siteleri için kullanıldığında site tasarımına  çok farklı bir görünüm katacak ayarlara ve efektlere sahip.

 

Kullanım

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

Js dosya  adresleri :

<script src="js/jQuery.js" type="text/javascript"></script>
<script src="js/ayaSlider.js" type="text/javascript"></script>

 JavaScript : 

<script>
//set default options and initiate ayaSlider
$(document).ready(function(){
    $('#slideShow').ayaSlider({
       easeIn : 'easeOutBack',
       easeOut : 'linear',
       delay : 4000,
       ....,
       ....
    });
});	
</script>

 Body  etiketleri arasına eklenmesi  gereken bölüm : 

<div id="slideShow">
   <!-- Slayt 1 -->
   <div data-in="options" data-out="options">
      <div data-in="..." data-out="...">
        Some content to slide
      </div>
   </div>
   <!-- Slayt 2 -->
   <div data-in="..." data-out="...">
      ....
   </div>
</div>
Ali
Telif Hakkı Bildirimi:Bu sitedeki orijinal makaleyi Ali2020-09-10 tarihinde yayınlandı,Toplam 1687 karakterden oluşmaktadır.
Yeniden yazdırma ipuçları:Özel talimatlar dışında, bu sitedeki tüm makaleler CC-4.0 sözleşmesi kapsamında yayınlanmaktadır.Yeniden basılması için lütfen kaynak belirtiniz.
Yorum yap(Yorum yapılmamış)
Yükleniyor...