Bu videoda sizlerle başlangıçta basit bir slider hazırlayacağız.. Daha sonra otomatik dönen, yatay ve dikey kayan, carousel mantığı ile çalışan slider örneklerini hazırlayacağız.. Kısaca bu videoyu satın alan birisi her halukarda slider yapımını öğrenecektir.
Yorumlar
$(function(){
0 0$(".sayfa a:first").addClass("aktif");
$("ul.slider li").hide();
$("ul.slider li:first").show();
var toplamLi = $("ul.slider li").length;
var deger = 0;
$(".sayfa a").hover(function(){
var indis = $(this).index();
$("ul.slider li").hide();
$("ul.slider li:eq("+indis+")").slideDown(250);
$(".sayfa a").removeClass("aktif");
$(this).addClass("aktif");
return false
});
$("a#son").click(function(){
$(".sayfa a").removeClass("aktif");
$("ul.slider li").hide();
if (deger < toplamLi - 1){
deger++;
$("ul.slider li:eq("+deger+")").slideDown(250);
$(".sayfa a:eq("+deger+")").addClass("aktif");
}else {
deger = 0;
$("ul.slider li:first").slideDown());
$(".sayfa a:first").addClass("aktif");
}
return false
});
});
Hocam hata neresinde bunu sizce $(function(){
0 2$(".sayfa a:first").addClass("aktif");
$("ul.slider li").hide();
$("ul.slider li:first").show();
var toplamLi = $("ul.slider li").length;
var deger = 0;
$(".sayfa a").hover(function(){
var indis = $(this).index();
$("ul.slider li").hide();
$("ul.slider li:eq("+indis+")").slideDown(250);
$(".sayfa a").removeClass("aktif");
$(this).addClass("aktif");
return false
});
});
benim slider üzerine gelince durmayı bırak resmen uçuyo :D
0 0tayfun hocam slider yaparken geçişlerde ok işareti ile geçiş yapmak istiyorum. örneğin http://maol.meb.gov.tr/ deki gibi. herşey tamam ancak geçişlerde ok olayı olmuyor yardımcı olursanız çok sevinirim. AEO
0 0Yorumu yayınlamasanız da olur buldum sorunu :D
0 0Sorun benden kaynaklıymış yanlış yere position koymuşum :) ama şimdide kaydırmada sıkıntım var.Her şey çok güzel çalışıyor ama geçişler sırasında hiç bekleme yapmıyor. Neredeyse sürekli geçiyor gibi, değişme sürelerini arttırsam bile sadece ilk li de işe yarıyor. 1 yıldır cevap gelmemiş buna da pek geleceğini sanmıyorum :)
0 0Selam Tayfun hocam. Eline koluna sağlık çok güzel bir kaynak sağlamışsınız. Benim ufak bir sorunum var. Videodaki uygulamayı birebir yaptım. Yandan kayarak gelene kadar herşey sorunsuzdu ama nedense bir türlü float:left komutunu yemedi. Sürekli alta sıralıyor. Neden olabilir acaba?
0 0Kaynak dosyaları yükleyebilir misiniz?
0 0kaynak dosyalar yüklenirse bende dersi satın almak istiyorum ..
0 0Tayfun 2 hafta olmuş bende kaynak dosyaları bekliyorum eğer şu anda elinde varsa yüklersen seviniriz :)
1 0Yakın zamanda kaynak dosyalarını ekleyeceğim, teşekkürler.
3 0ben otomatik geçişi beceremedim bi türlü. Tıklayarak gezebiliyorum sıkıntım yok. Ama otomatikte sayfaya geçiş yapmıyor. JS dosyasını paylaşabilirmisiniz.
0 0@uhalil, teşekkür ederim.. Devamı gelecek inşallah.
1 0Tayfun Hocam Çok Teşekkürler. Gayet işime yaradı. Kaliteli derslerinizin devamını bekliyoruz...
0 0Bir slider ile yapılabilecek her şeyi anlatmışsın, teşekkürler Tayfun abi.
1 0Klavyene sağlık tayfun mükemmel bir anlatım olmuş.Kendim uğraşarak açıklama eklemeye çalışacağım.
0 0@audi97, teşekkürler. Zamanla yenileride gelecek inşallah.
1 0kardeş emeğine sağlık yeni kaliteli dersler bekliyoruz senden
1 0