Forum
Aktif konular
Üyeler
Kurallar
Arama
Div Width Yüzde Yüz İken Float Vermek Div Width Yüzde Yüz İken Float Vermek
-
Merhabalar hocalar, gece gece buna takıldım, bir türlü beceremedim.
Javascript ile bir slider yapmak istiyorum ( hazır slider istemiyorum). JS kısmı sorun değil ancak CSS kısmında takıldım.
width:100% height:500px olan bir div var. Bu div içerisinde gene 100% genişlikte 3-4 adet floated div olacak, Bu divlerın içerisinde resim ve metin olacak(resim background position center, size cover şeklinde verdim böylece tüm sayfayı kaplıyor genişlik olarak). bir timer aracılığı ile sırayla değişecekler ( left: - window.width*index)
ancak dış div in içerisindeki divleri bir türlü float ile yanyana dizemedim.
Nerede yanlış yapıyorum, bilmediğim nedir?
Şimdiden önerielr için teşekkürler.
-
https://jsfiddle.net/
kodlarını buraya yükler misin hocam ? Bakalım
-
Hocam slider'ları ul li içerisinde yaparsan olur.
Yanyana liste yapıyorsun resimlerden, sonrasında animate metoduyla margin-left'leri negatife doğru kaydırıyorsun.
Limitin total slider genişliği oluyor yani window.width()*slider_sayisi
margin-left'in de negatifliği bu sayıya geldiğinde, slider'ın başa dönsün istiyorsan sıfırlıyorsun yok geri geri gitmeye başlasın istiyorsan, bu sefer pozitife doğru gidiyorsun.
Ordaki limitin de 0.
Bunu da setInterval içine koyarsan, otomatik dönmeye başlar.
Bu sağdan sola doğru (margin-left)
yukardan aşağı gitsin dersen margin-top'ı gibi şeyler. Yani orası senin yaratıcılığın.
Ya da fideIn ile belirterek yapmak istersen, hiç list falan yapma hepsini altalta koy, class'larını hide yap. Sırayla fadeIn fadeOut yap.
Bir sürü şekli var ama genel mantık bu.
Yine de tavsiyem plugin kullanman, amerika'yı yeniden keşfetme. En çok tercih edilenler de aşağıda :
https://owlcarousel2.github.io/OwlCarousel2/
manyaki tarafından 20/Haz/17 09:09 tarihinde düzenlenmiştir -
manyaki bunu yazdı
Hocam slider'ları ul li içerisinde yaparsan olur.
Yanyana liste yapıyorsun resimlerden, sonrasında animate metoduyla margin-left'leri negatife doğru kaydırıyorsun.
Limitin total slider genişliği oluyor yani window.width()*slider_sayisi
margin-left'in de negatifliği bu sayıya geldiğinde, slider'ın başa dönsün istiyorsan sıfırlıyorsun yok geri geri gitmeye başlasın istiyorsan, bu sefer pozitife doğru gidiyorsun.
Ordaki limitin de 0.
Bunu da setInterval içine koyarsan, otomatik dönmeye başlar.
Bu sağdan sola doğru (margin-left)
yukardan aşağı gitsin dersen margin-top'ı gibi şeyler. Yani orası senin yaratıcılığın.
Ya da fideIn ile belirterek yapmak istersen, hiç list falan yapma hepsini altalta koy, class'larını hide yap. Sırayla fadeIn fadeOut yap.
Bir sürü şekli var ama genel mantık bu.
Yine de tavsiyem plugin kullanman, amerika'yı yeniden keşfetme. En çok tercih edilenler de aşağıda :
Bir slider çalışma mantığı bu kadar kolay anlatılabilirdi, tebrikler. K.O Perfect
Puanım 9
-
manyaki bunu yazdı...
hocam cok tesekkurler mesaj icin ancak bunlar zaten bildigim seyler. sanirim derdimi dogru duzgun anlatamamisim. benim ogrenmek istedigim: belirli bir genislik verilmis nesnenin icerisinde baska nesneleri, distaki nesnenin boyutunu asacak sekilde siralayip siralayamayacagimdi. bugun ogrendim ki olmuyormus. en distaki nesnenin boyutu kadar gecerliymis bu islem. bende boyle dusunmustum ancak isyerindeki birini yanlis anlayinca boyle bir sey mumkun zannettim.
sorunumu en distaki tutucu olarak kullandigim divi toplam slide sayisi kadar buyuterek cozdum, yani sayfa acilisinda js ile alinan olcum ile tutucunun boyutunu buyulttum. yani boyut onload asamasinda belirlendi.
mantiksal acidan ben de liste kullanilmasindan yanayim. ancak benim yaptigim ufak bir projeydi ve bilgimi sinama amacliydi. o yuzden hazir bir slider kullanmadim.
tekrar tesekkurler cevaplar icin.
Kısayol
Şikayet
Özel Mesaj
Alıntı yap
Cevapla