JQuery – Portfolyo Slider
Merhaba Arkadaşlar,
Sizlere yeni tarz sitelerde gördüğünüz, jquery ile yapılmış bir portfölyo çalışmayı paylaşacağım. Bu uygulamayı gördüğünüzde zaten sayfanızda nerelerde kullanacağınıza karar vereceksiniz. Benim beğendiğim çalışmalardan bir tanesidir. Sizinde beğeneceğinizi sanıyorum.
İndireceğiniz çalışmada index.html dosyası 3 adet ise klasör bulunmaktadır. Bu klasörlerin 2 si jquery kodları ve css kodları barındırmaktadır. Çalışmanın ayarları yapıldığı için sizin o iki klasörle uğraşmanıza gerek yok. Ama images klasörünün içinde assets diye bir klasör var resimlerinizi buraya koyuyorsunuz sonrada index.html dosyasında tanımlıyorsunuz o kadar. index.html dosyasını açtığınızda 1. slider 2. slider …. 7.slider a kadar gidiyor daha fazla slider koymak istiyorsanız bu kodların olduğu satırı olduğu gibi kopyalayıp sonraki slider altına yapıştırmanız gerekmektedir. Çalışmayı anlayabilmeniz için çok iyi şekilde düzenledim. index.html dosyasına baktığınızda bunu çok iyi anlayacaksınız. Herbir sliderın üzerine slider numarası koydum,türkçeleştirdim vs. vs.
Örneğin.
<!-- #### 6. slider ### --> <li> <div> <img src="./images/standard/latest_projects/pic6.jpg" alt=""> </div> <div> <div>Ut duo odio posse</div> <div><a href="#"> <span> Devamı</span></a></div> <div></div> <div>Et vel mutat clita torquatos, est in euripidis scriptorem, ex doming dolores democritum.<br><br> In quando argumentum quo, at eam altera blandit gloriatur, id usu solet dicunt perfecto.</div> </div> <div> <div>Sarı renkli</div> </div> </li>
kısacası 6. slider yapım kodu yukarıda yer almıştır. Bu kodu olduğu gibi kopyalayıp 8. slider başlığını atarak ve resmi değiştirerek işleminizi tamamlayabilirsiniz. Devamı olan
<div><a href="https://www.omerbozalan.com"> <span> Devamı</span></a></div>
yukarıdaki satırda ise devam yazısına tıkladığınızda gidilecek linki yazıyor. Ben oraya kendi sitemi yazdım. Sizde istediğinizi yazabilirsiniz.
Şimdilik bu kadar. Anlamadığınız bir nokta olursa yorum kısmından iletişime geçiniz.
KOLAY GELSİN.
ÇALIŞMAYI GÖRMEK İÇİN TIKLAYIN
ÇALIŞMAYI İNDİRMEK İÇİN TIKLAYIN
(65)
Yorum(14)
Yorum bırakın Yanıtı iptal et
Bu site, istenmeyenleri azaltmak için Akismet kullanıyor. Yorum verilerinizin nasıl işlendiği hakkında daha fazla bilgi edinin.
Hocam çok teşekkür ederim emeğine ve anlatımına sağlık. Uzun zamandır böyle bir plugin arıyordum. tekrardan Teşekkürler
Harikasınız teşekkürler…
resmin üzerine geldiğimizde tamamına değilde yarısına kadar o perdeyi indirmek istesek ne yapmalıyız
hocam çok iyiymiş kesin kullanırım teşekkürler
otomatik geçişli olarak nasıl yapabilirz.
ömer bey çalışma çok güzel ben indirip uyguladım fakat aynı sayfada nivo slider da var onunla çakıştı bununla ilgili olarak ne yapabilirim bir bilginiz var mı?
Ömer bey 2 slider da aynı sayfa için kullanmak istemiştim üst kısımda nivo slider büyük resimlerle
alt bolumdede urunleri küçük resimlerle tanıtmak için minislides kullandım fakat zannediyorum nivo liderdan dolayı minislides taki resimler alt alta çıkıyor üzerine gelinince kısa çizgi ve devamı yazısıda uzun bir sekilde resmin altın da çıkıyor diyer resimler de alt alta geliyor çizgilerde ve devamı yazılarıda uzun ve alt alta çıkıyor bununla ilgili bir çözüm varmıdır yazarsanız sevinirim teşekkürler…
Ömer bey ben bir çözüm yolu aradım ama bulamıyorum lütfen var ise siz söylermisiniz.
Ömer bey benim yapmaya çalıştığım siteme Carouselslider eklemem gerekiyor fakat sizin portfolyo slider nivo sliderla çakıştığı için çalışmadı. nivo sliderın böyle bir uygulamasıvar mıdır.çok teşekkürler
Ömer bey sizi çok rahatsız ettim biliyorum kusura bakmayın, ben nivo slider ile olan çakışmayı çözdüm çözünce verdiğiniz örnek şıp diye çalıştı çok teşekkür ederim. ömer bey sağlığınız hep daim olsun bizleri güzel ders anlatımlarınızdan mahrum bırakmayın sevgilerle.
Gülşah hanım gün içinde işlerimin yoğunluğundan sizin msjlarınızı yeni gördüm. Kendi işinizi kendiniz görmeniz beni mutlu etti. 🙂 Kolay gelsin.
ömer bey yine ben bir ricam olucak sliderı çalıştırdım fakat manuel çalışıyo otomatik tek tek dönmesi için ne yapmak gerekli sevgilerle…
Malesef bu slider manuel ilerleyen bir slider. Değişiklik için yazılım bilmelisiniz.
emeğinize sağlık hocam
çok güzel bir insansınız siz
her şey karşılıksız
tek amaç insanların bir şeyler öğrenmesi