Etiketler: jqueryslider yapımı

Jquery ile slider

06/09/2020 -- Engin Beyazgül -- webmaster

      

   Jquery ile yapmış olduğum basit slider bugünkü yazı konum olacak;

    Sliderlar web sayfalarının mihenk taşlarından biridir. Modern web sayfalarında slider görmeme gibi bir ihtimaliniz yoktur. Web sayfası sahibi ürününü, fikrini, haberini, tanıtımını vs.gibi amaçlarını sliderlar sayesinde web sayfasını ziyaret eden kullanıcılara direkt ve göz alıcı şekilde gösterir. Kullanıcıların genelde kolay olanı seçmesi hasebiyle sliderda bulunan ögelerin, başarıya eriştirme olasılığı çok yüksektir. Örneğin haber okumak için bir haber sitesine girdiğimizde kuvvetle muhtemel ilk baktığımız ve kullandığımız araç slider olacaktır.

 

    Sliderlar çok farklı şekillerde ve boyutlarda bulunmaktadır. Ama sliderların ana mantığı verileri kaydırmalı şekilde kullanıcıya göstermektir. Sizlerle paylaştığım slider klasik sliderlardandır. Veriler kendiliğinden akar ya da kullanıcı önceki sonraki butonlarına basarak kontrol edilebilir. Bu kadar teorik yazıdan sonra sliderımızı yapalım. 

 

 

    Kod editöründen giderek yaptıklarımdan kısaca bahsetmek isterim;

HTML:

CSS:

    Butonlarımızın boyutlarını nerede bulunacaklarını sliderımızın boyutunu vs. ayarlayıp, kozmetik güzelleştirmelerimizi de ayarladıktan sonra slider için buradaki kritik noktalar, sliderımızın kapsayıcı divine overflow:hidden; vererek divin genişliğinden dışarı taşan kısımları gizlemek ve sola doğru akan bir slider elde etmek için tüm resimlerimizin x ekseninde tek bir satırda bulunması için list elemanlarımıza float:left; veriyoruz.

JQUERY:

 

Kategoriler

Sosyal

Sitede ara

İstatistikler

enginbeyazgul.com

1042

gündür yayında.

9

adet yazı mevcut.