17. Gün – jQuery ile Slider Uygulaması

On yedinci jQuery dersimizde aşağıdakini öğrendik;
– jQuery ile Slider Uygulaması

Yatay Slider Demo;
http://www.prototurk.com/demo/yatay-slider/index.html

Dikey Slider Demo;
http://www.prototurk.com/demo/dikey-slider/index.html

Örnek Uygulamayı İndirin;
http://yadi.sk/d/Dh3Ir7rA21J1h

Yayınlayan

Tayfun Erbilen

2009'dan beri web işleriyle uğraşan, aynı zamanda amatör müziklede ilgilenen sıradan birisi..

“17. Gün – jQuery ile Slider Uygulaması” üzerine 19 yorum

  1. Yaptığın gerçekten çok güzel ve öenmli bir iş kardeşim. Umarım bu şekilde devam edersin. Sen böyle samimi olduğun sürece herzaman destekçiniz merak etme.. 🙂

  2. Hocam peki geçiş efektini değiştirmek mümkünmü mesela animate komutu ile sağa ve sola doğru animasyon uygulamışsınız bunu fade şeklindede yapabilirmiyiz

  3. Merhaba, öncelikle çok teşekkür ederim anlatım çok güzel fakat bir şey sorcam örneğin 5 adet resim dönecek, ileri ve geri butonlarım var ileri basıyorum değişiyor fakat en son 5. resme geldiğinde yine ileri bastığımda hiçbir şey olmuyor, tekrar 1. resime dönmesi için ne yapmalıyım, yani her seferinde 1 – 2 – 3 – 4 – 5 olsa daha sonra yine ileri basarsam tekrar 1 e gelip 2 3 diye devam etse

  4. @fatih, rica ederim. Eğer sona geldiğinde tekrar başa dönmesini istiyorsanız, a.sonraki linkine tıkladığımızda bir if koşulumuz vardı, eğer toplamli – 1'den küçükse işlem yapıyorduk buna else ifadesini ekleyin. Else, sona geldiğinde çalışacaktır. if içerisinde kodları aynen alıp else içine kopyalayın. Sadece else içinde liDeger++ yerine liDeger = 0; şeklinde yazın. Sona geldiğinde liDeger 0'a eşitlenecek ve tekrar başa dönüp aynı işlemleri yapacaktır.

  5. tekrar merhaba Tayfun, belki konuyu hortlatmış olacam ama, sormak istediğim bir konu var jquery carousel slider yapmak istediğimizde mesela ekranda 2 adet görünsün ve 2, 2 kaysın istediğimizde nasıl bir düzenleme yapmamız gerekiyor ?

    tekrar merhaba tayfun, konuyu hortlatmış olcam ama bir sorum olacak carousel slider yapmak istediğimizde örneğin ekranda aynı anda 2 resim göstermek istiyorum yan yana ve 2 li olacak şekilde kaymasını istiyorum bunun için nasıl bir düzenleme yapmalıyız

  6. Tayfun ben düzenlerken ileri ve geri butonların da bir hata yapmışım sanırım hover olayı hareket butonlarını da kapsadığı için süre sıfırlanıyormuş yeni farkettim kardeş kusura bakma az önceki yazdığım yorumu yayınlamasan da olur 😉 tek sorun geri butonuna basıldığında sürekli geri gitmesi bunun nasıl yapılacağını söylersen on numara olcak :))

  7. @Bektaş, önceki kısmında şu kodları;

    if (liDeger > 0){
    	liDeger--;
    	yeniWidth = liWidth * liDeger;
    	$(".slider ul").animate({marginLeft: "-" + yeniWidth + "px"}, 500);
    }

    Şöyle değiştirmen gerekiyor;

    if (liDeger > 0){
    	liDeger--;
    } else {
    	liDeger = toplamLi - 1;
    }
    yeniWidth = liWidth * liDeger;
    $(".slider ul").animate({marginLeft: "-" + yeniWidth + "px"}, 500);
  8. Düşüncelerin yalnız olmadığını unutturmayan bir temelsin bence hocam, ülke için de bu anlamda kişisel blog'unuzda yararlı olmak adına yaptığınız paylaşımlar, küçükte olsa bir toplumu oluşturmakta. Teşekkürler, başarılar..

  9. Çok güzel anlatım ve anlatımlar, diğer derslerinizi de takip ediyorum sayenizde bir türlü öğrenmek için başlayamadığım jquery ile haşır neşir oldum istediğim şeyleri yapabilecek kıvama geliyorum. Başarılar dilerim

  10. Merhaba kardeşim. Derslerini takip ediyorum ve kod işine yeni başladım. grafik mezunuyum.. Bi site üstünde çalışıyorum şu an.. derslerin çok iyi ve de anlaşılır. yalnız bi kaç ricam olacak. Full screen için yukarıda ki kodlarda ne gibi bi değişiklik yapmamız lazım ve resim değiştiğinde resim üstüne yazı yani text slider da olsun istiyorum.. bunun için ayrı bi ders yapabilir misin?
    Teşekkür ederim şimdiden saygılar..

  11. Hocam ağzına sağlık 🙂 Anlatım epey eski fakat sene olmuş 2015 ben halen bununla uğraşıyorum 🙂 Yapmak istediğim şey bu slider uygulamasını site içerisinde birden fazla kullanmak. Bunu pratik bir şekilde nasıl yapabilirim ?

  12. @Kürşad ALTAN , yapman gereken slider elemanını each ile döngüye sokup her biri için ayrı ayrı yazmak yerine each içerisinde this’e göre yazman olacak.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir