Paralaks Kaydırıcı

Paralaks Kaydırıcı manuel kontrollerle görüntüleri slayt gösterisi şeklinde görüntülemek için ilginç bir çözüm. Küçük resimlerin orijinal yerleşimini çeker. Resmi site, kaydırıcının entegrasyonu ve yapılandırmasının tam bir dökümüne sahiptir.

jQuery ile Minimalist Slayt Gösterisi Galerisi otomatik görüntü değiştirme öğelerinin yanı sıra ekranı manuel olarak kontrol etme ve küçük resimler içeren bir açılır bloktan görüntüleri seçme yeteneğine sahip mükemmel bir resim galerisi. Eksilerden, tam ölçekli görüntülerin izlenmediği not edilebilir, ancak bu, bu galerinin minimalizmidir.

Bu, otomatik olarak değişen görüntülere sahip tam ekran bir slayt gösterisidir, akıllara durgunluk veren efektler yoktur, her şey basit ve zevklidir.

Galeriyi Küçültçok çeşitli görüntü geçişlerine sahip son derece özelleştirilebilir bir jQuery eklentisidir. Minimit Gallery'yi kullanarak, atlıkarınca, slayt gösterisi, basit bir döndürücü ve normal bir görüntü kaydırma çubuğu biçiminde görüntülerin bir gösterimini düzenleyebilirsiniz.

görüntüleri slayt gösterisi olarak görüntülemek için basit ve mantıklı bir yol sağlayan küçük (2kb) bir jQuery eklentisidir.

tüm bilgisayarlar, iPhone'lar ve mobil cihazlar arasında sezgisel kontroller ve kusursuz uyumluluk ile hoş görünümlü bir javascript galerisidir. Kurulumu ve yapılandırması çok kolay

Birçok Javascript ve jQuery görüntü kaydırıcısının aksine Slider.js, CSS3 geçişlerinin ve animasyonlarının verimliliğine dayalı hibrit bir çözümdür.

Bu, HTML5 ve CSS3'te çeşitli sunumlar oluşturmak için tek sayfalık bir şablondur.

diyapo slayt gösterisi açık kaynaklı bir projedir. İsterseniz değişiklik veya iyileştirme önermekten çekinmeyin. Ücretsiz olarak indirebilir ve kullanabilirsiniz ve hiçbir şey ve hiç kimse bu kaydırıcıyı projelerinizde kullanmanızı engellemez. Kaydırıcının kurulumu kolaydır, sunulan içerik arasında ilginç geçişler vardır ve kaydırıcıya herhangi bir şey yerleştirebilirsiniz, herhangi bir pervaz olmadan oldukça hızlı çalışır.

web sitelerinde ve diğer web projelerinde slayt gösterileri oluşturmak için başka bir araçtan başka bir şey değildir. Tüm modern tarayıcılar tarafından desteklenir, yatay ve dikey animasyonlar, özel geçişler için destek, geri arama API'si ve daha fazlası. Slaytlarda herhangi bir html öğesini kullanabilirsiniz, yeni başlayanlar için anlaşılır ve erişilebilirdir, tamamen ücretsiz olarak dağıtılır.

Çevik Geliştirme için JavaScript Slayt Gösterisi

Bu harika jQuery eklentisi ile slayt gösterilerinizi özelleştirin. İçerik sunumunuzu gereksinimlerinize göre oluşturabilmeniz için son derece özelleştirilebilir bir araç. Harici verilerle veya CMS'nizdeki verilerle daha kolay entegrasyon için veri biçimi . Bu yeni bir versiyondur ve sıfırdan yazılmıştır. Geliştiriciler, beyin çocukları ile çalışma sürecinin tamamını en anlaşılır ve anlaşılır şekilde açıklamaya çalıştılar.

çekici animasyon efektleriyle sırasız listeleri slayt gösterilerine dönüştürmenizi sağlayan bir jQuery eklentisidir. Slayt gösterisinde, sayıları veya küçük resimleri kullanarak veya Önceki ve Sonraki düğmelerini kullanarak bir slayt listesi görüntüleyebilirsiniz. Kaydırıcı, bir küp (çeşitli alt görünümlere sahip), bir boru, bir blok ve daha fazlasını içeren birçok başlangıç ​​animasyon türüne sahiptir.

Web projelerinizde çeşitli içeriklerin her türlü sunumunu düzenlemek için eksiksiz bir araç seti. Burjuva adamlar, jQuery'nin büyüsünü kullanarak, klipte yer alan hemen hemen her türlü kaydırıcı ve galeride ellerinden gelenin en iyisini yaptılar. Fotoğraf kaydırıcısı, fotoğraf galerisi, dinamik slayt gösterisi, atlıkarınca, içerik kaydırıcısı, sekmeler menüsü ve çok daha fazlası, genel olarak yorulmak bilmeyen hayal gücümüzün gezinmesi için yer var.

Bu, basitlik göz önünde bulundurularak oluşturulmuş bir jQuery slayt gösterisi eklentisidir. Hem yeni başlayanlar hem de ileri düzey geliştiriciler için yalnızca en kullanışlı özelliklerle dolu olup, basit ama son derece etkili, kullanıcı dostu slayt gösterileri oluşturma yeteneği sağlar.

- jQuery üzerine kurulu basit bir kaydırıcı, her bakımdan basit, özel beceriler gerektirmeyen, birçok kişinin sitelerinde bir slayt gösterisi uygulaması için kullanışlı olacağını düşünüyorum. Eklenti, yavaş IE dahil tüm modern tarayıcılarda test edilmiştir.

jbgaleri jQuery javascript kitaplığında yazılmış bir tür kullanıcı arabirimi widget'ıdır. İşlevi, tam ekran modunda sitenin arka planı olarak büyük bir resmi, kaydırıcı olarak birkaç resmi göstermektir. Tüm görünüm modlarında görünüm kontrolleri bulunur. Kendi yolunda, ilginç bir çözüm, standart bile olmayan bir yerde.

Fotoğraflarınızı resimler arasında geçiş efektleriyle (görülen ve daha ilginç) bir slayt gösterisi olarak görüntülemek için kullanımı kolay bir jQuery eklentisidir. jqFancyTransitions, Safari 2+, Internet Explorer 6+, Firefox 2+, Google Chrome 3+, Opera 9+ ile uyumludur ve kapsamlı bir şekilde test edilmiştir.

Lightbox formundaki resimleri ve diğer bilgileri görüntülemek için ücretsiz bir jQuery eklentisidir. Kontroller, gölgeli arka plan ve hepsi içeren açılır pencere, basit ve zevkli.

Lightbox serisinden bir başka jQuery eklentisi, utanç verici derecede az (9 KB) olmasına rağmen, iş için birçok fırsatı var. CSS ile her zaman geliştirebileceğiniz veya özelleştirebileceğiniz, düzgün tasarlanmış bir arayüz var.

Zaten adından da anlaşılacağı gibi, hiçbir şey fantezi değil, tamamen eksik kontrolleri olan çok basit bir otomatik görüntü kaydırma aracımız var. Kim bilir, belki minimalizmiyle bu kaydırıcı dikkatinizi çeker.

Farklı geçiş türlerine sahip görüntü döndürücü. Hem otomatik modda hem de tıklamayla çalışır, kurulumu oldukça kolaydır.

- sadece bir kaydırıcıdan ziyade tam teşekküllü bir resim galerisi. Küçük resim önizlemesi ve geçiş efektini seçme yeteneği, tüm tarayıcılar için tam destek, bir web projesine entegrasyonun ayrıntılı bir açıklaması ve ücretsiz dağıtım.

Bu, scriptaculous/prototype veya jQuery kullanan kullanıma hazır slayt gösterilerinin bir uygulamasıdır. Horinaja biraz yenilikçi çünkü kaydırıcıya yerleştirilen içerikte gezinmek için tekerleği kullanmanıza izin veriyor. Fare işaretçisi slayt gösterisi alanının dışındayken, değişiklik otomatik olarak gerçekleşir, fare işaretçisi slayt gösterisinin üzerine getirildiğinde kaydırma durur.

Bir dizi en basit görüntü kaydırıcıdan bir çip, sırasıyla görüntüleme kontrollerinin varlığına rağmen, hem otomatik hem de manuel modlarda çalışır.

s3kaydırıcı- jQuery eklentisi, sıralanmamış bir resim listesinden bir slayt gösterisi oluşturur ve herhangi bir web sitesinde kolayca uygulanabilir.

Bu, bant genişliğini korurken büyük miktarda fotoğrafı işlemek için optimize edilmiş bir jQuery eklentisidir.

vegas arka plan

Vegas Background jQuery eklentisi, tümü slayt gösterisi öğeleriyle web sayfalarınıza güzel tam ekran arka plan resimleri eklemenize olanak tanır. Eklentiyle çalışmanın inceliklerini dikkatlice incelerseniz, yalnızca ihtiyacınız varsa, elbette birçok ilginç çözüm bulabilirsiniz.

- "poke" yöntemini kullanarak, makalelerin görüntüleri veya duyuruları ve basit kontroller için başlıklar içeren, daha az değil, kaydırıcı gibi bir kaydırıcı.

görüntüleri görüntülemek için hafif (yaklaşık 5 KB) bir javascript. Büyük görüntülerin otomatik olarak yeniden boyutlandırılması ve ölçeklenmesi, görüntüyü tarayıcı penceresinde tam boyutta görüntülemenize olanak tanır

PikaChoose jQuery resim galerisinin 4. sürümü çıktı! Pikachoose harika özelliklere sahip hafif bir jQuery slayt gösterisidir! Fancybox ile entegrasyon, mükemmel temalar (ücretsiz olmasa da) ve çok daha fazlası eklenti geliştiricileri tarafından dikkatinize sunulmaktadır.

Listenizdeki görüntü sayısını kontrol eder ve dijital gezinme olarak dinamik olarak bir dizi fotoğraf bağlantısı oluşturur. Ayrıca, her bir resmin üzerine tıklamak ileri veya geri hareket edecektir ve ayrıca resmin üzerine tıkladığınız alana bağlı olarak resimler arasında gezinebilirsiniz (örneğin: resmin sol tarafına tıklamak slaytları ileri geri hareket ettirir, sırasıyla, görüntünün sağ tarafı için).

Herhangi bir WordPress şablonuna mükemmel şekilde uyan başka bir jQuery kaydırıcısı.

"Nivo"nun bir başka gelişimi, bu stüdyodaki adamların yaptığı her şey gibi, eklenti yüksek kalitede yapılmış, 16 benzersiz geçiş efekti, klavye navigasyonu ve çok daha fazlasını içeriyor. Bu sürüm, doğrudan WordPress için özel bir eklenti içerir. Bu blog motorunun tüm hayranları için, Nivo Slider konu için doğru olacaktır.

Her boyuttaki görüntü için hızlı bir şekilde basit, etkili ve güzel bir kaydırıcı oluşturmanıza olanak tanıyan jQuery eklentisi.

Pirobox- Bu hafif bir jQuery "lightbox" betiğidir, görünüm, tüm kontrollerle görüntünün boyutuna otomatik olarak ayarlanan bir açılır blokta gerçekleştirilir.

Bu galerinin yaratıcıları, oldukça orijinal bir resim sunumu sunuyor. Görüntüler bir dalga biçiminde küçük resimler olarak görüntülenir, küçük resme tıkladığınızda görüntünün orta boyutlu bir versiyonunu göreceğiz, ikinci kez tıkladığınızda büyük bir görüntünüz olacak. Bunu bir deney olarak kabul edebilirsiniz, ancak itiraf etmelisiniz ki yeni, olağandışı bir şey her zaman ilginçtir.

HTML5 ve jQuery ile tam ekran slayt gösterisi

Slayt gösterileri oluşturmak ve görüntüleri tam ekran modunda görüntülemek için geliştiriciler, grubun makalelerinde daha önce ayrıntılı olarak açıklanan birçok fikir ve tekniği içeren tanıdık Vegas jQuery eklentisini kullandılar. HTML5 ses öğelerinin varlığından ve görüntüler arasındaki geçişlerin stilinden etkilenir.

Codrops ekibinin bir diğer gelişmesi, tam teşekküllü ve işlevsel bir resim galerisi, ancak onu tarif etmenin amacı ne, onu görmelisiniz.

Görüntü slayt gösterisi, resimler gözünüzün önünde kayboluyor, efekt sadece harika.

jQuery kitaplığına dayalı bir JavaScript resim galerisi çerçevesidir. Amaç, web ve mobil cihazlar için profesyonel bir resim galerisi geliştirme sürecini basitleştirmek. Bir açılır pencerede ve tam ekran modunda görüntülemek mümkündür.

Sessizce alışmaya başlıyoruz ve Codrops ekibinden yeni çalışmalar bekliyoruz. Resimleri tam ekran modunda görüntülemek için lütfen harika bir 3D geçiş efektine sahip harika bir resim kaydırıcısı edinin.

WordPress için başka bir slayt gösterisi düzenleyici eklentisi. Hemen hemen her tasarıma kolayca entegre olur ve hem ileri düzey kullanıcılar hem de deneyimsiz kullanıcılar için birçok özelleştirme seçeneği sunar.

WordPress için yazılmış başka bir eklenti, bloglarınızdaki resimlerin veya diğer içeriklerin slayt gösterilerini düzenlemeyi çok daha kolay hale getirecek.

Wordpress entegrasyonu için güzel bir slayt gösterisi eklentisi. Xili-floom-slideshow otomatik olarak yüklenir ve kişisel ayarlara da izin verilir.

ince kutu2"Lightbox" efektli görüntüleri görüntülemek için iyi kurulmuş bir WordPress eklentisidir. Tarayıcı penceresinde otomatik slayt gösterisini ve resmi yeniden boyutlandırmayı destekler. Ve genel olarak, bu eklentinin bu serideki diğer eklentilere göre birçok avantajı vardır.

Bu eklenti, widget, WordPress tarafından desteklenen web siteniz veya blogunuz için dinamik, kontrol edilebilir slayt gösterileri ve sunumlar oluşturmanıza olanak tanır.

Bu WordPress eklentisi, gömülü galeri resimlerini basit ve esnek bir slayt gösterisine dönüştürür. Eklenti, FlexSlider jQuery görüntü kaydırıcısını ve kullanıcı tercihlerini kullanır.

SmugMug, Flickr, MobileMe, Picasa veya Photobucket RSS beslemesinden fotoğrafların, resimlerin slayt gösterilerini düzenlemek için kullanılan, saf Javascript kullanılarak desteklenen ve görüntülenen bir WordPress eklentisidir.

Sadece WordPress için değil, basit bir kaydırıcı. Gereksiz ve hantal bir şey yok, iş minimalist bir tarzda yapılır, vurgu istikrar ve hız üzerindedir, blog yönetim motoruna mükemmel bir şekilde bağlanır.

Bence Skitter, oradaki en iyi wordpress kaydırıcılarından biridir. Çok belirgin kontroller, geçiş efektleri ve temayla oldukça basit bir bağlantı değil, kararlılık ve hız çekiyor.

Slayt gösterisi modunda görüntüleme özelliği ile sitenizdeki bir resim galerisini hızlı ve kolay bir şekilde düzenleyebileceğiniz bir WordPress eklentisidir. Ekran, küçük resimler ve resim yazıları ile otomatik veya tam olarak kontrol edilebilir.

Of.Site | Demo

Bir gönderi/sayfa için tüm resimleri slayt gösterisi olarak gösterir. Kolay kurulum. Bu eklenti, geçiş animasyonu sürümü için Adobe Flash gerektirir, Flash bulunamazsa kaydırıcı normal şekilde çalışır.

Yazıların resimlerini ve makalelerin kısa önizlemelerini gösteren WordPress için başka bir basit kaydırıcı. Bu blogda zaman zaman böyle bir eklenti kullanıyorum.

Meteor Slides, aralarından seçim yapabileceğiniz yirmiden fazla geçiş stiline sahip bir jQuery wordpress kaydırıcısıdır. Yazar, eklentiye bir “meteor” adını verdi, muhtemelen işin hızını ima etti, belki de meteorik bir şey fark etmedim.

oQey Gallery, gömülü video ve müzik özelliklerine sahip wordpress için slayt gösterisi öğelerine sahip eksiksiz bir resim galerisidir.

Web sitelerinde ve bloglarda resim ve videoları görüntülemek için flash animasyon öğeleri içeren bir slayt gösterisidir. Bu kaydırıcıyı herhangi bir web sitesine koyabilir, istediğiniz boyuta ve istediğiniz içeriğe koyabilirsiniz.

Flash Galeri eklentisi, gönderi başına birden fazla albüm, tam ekran tarama ve slayt gösterisi modu desteği ile normal galerilerinizi çarpıcı resim duvarlarına dönüştürür.

WOW Slider, WordPress için harika görsel efektler (Patlama, Uçma, Panjurlar, Kareler, Parçalar, Temel, Soldurma, Yığın, Dikey Yığın ve Doğrusal) ve profesyonel olarak oluşturulmuş şablonlara sahip bir jQuery görüntü kaydırıcısıdır.

Promosyon Kaydırıcısı, bir sayfada basit bir slayt gösterisi veya birden çok dönen reklam bölgesi oluşturmayı kolaylaştıran bir jQuery eklentisidir, çünkü son derece özelleştirilebilir olduğundan, kaydırıcıda gösterilenler ve modülün genel olarak nasıl çalıştığı üzerinde tam kontrole sahip olursunuz.

| Demo

2.4 sürümündeki yenilikler: Doğrudan WordPress düzenleyicisi aracılığıyla sürükle ve bırak fotoğraf sıralama desteği ve ana görüntülere fotoğraf bağlantıları ekleme yeteneği. (IE8'de hatalar olabilir, tüm büyük tarayıcılarda harika çalışır. Yazarlar gelecekte IE8 için tam destek sözü veriyorlar.)

| Demo

Bu incelemenin son akoru, görüntüleri seçme ve değiştirmenin ilginç görsel efektlerine sahip başka bir kaydırıcı olan WordPress için bu eklenti olacaktır.

Yukarıdakilerin hepsine bakıyorum ve ne kadar havalı insanların olduğunu merak ediyorum ve bu, çeşitli web geliştiricilerinin son zamanlarda web projelerinde görüntüleri düzenleme konusunda biriktirdiği her şeyden çok uzak. Galeriler ve slayt gösterileri oluşturmak için böyle harika çözümleri hayata geçirmenin artık mümkün olması harika.
Bu koleksiyonda kendiniz için ilginç bir şey bulacağınızı, kendi benzersiz galerinizi veya kaydırıcınızı, kullanıcılarınızın zevkine ve elbette sevdiklerinize ve onsuz nerede o zaman .. .

Genellikle en iyi galeriler jQuery'de oluşturulduğundan, esas olarak jQuery tipi kaydırıcılara odaklandık, ancak birkaç basit CSS galerisi de var.

Bu koleksiyon, tercih ettiğiniz bölüme kolayca geçiş yapabilmeniz için beş ana kategoride düzenlenmiştir. Başlamadan önce, size ücretsiz veya premium bir çözüm bulmanın size bağlı olduğunu söylemek istedik.

Keyif alacağınız birkaç ücretsiz kaliteli görüntü çözümü bulduk. Tabii ki, birinci sınıf kaynaklarla - bizi havaya uçuran bazı galeriler vardı.

Koleksiyonu gözden geçirin ve ihtiyaçlarınız için en iyi görüntü çözümünü bulun. Kişisel bir projeyse kesinlikle para harcamak istemeyeceksiniz. Ama öte yandan, eğer serbest çalışan bir işse, müşteriniz üzerinde gerçekten bir etki bırakmak ve aynı zamanda çok fazla zaman kazanmak için biraz para harcamaya değer olabilir!

Sanırım önerdiğim şey, her zaman ücretsiz bir çözümü değiştirmeniz, kurmanız veya kurmanız için ne kadar zaman gerektiğine bakmaktır. Bu kadar yetenekli değilseniz veya zaman alıyorsanız - kesinlikle önceden hazırlanmış kodlara ve bunun gibi ucuz ama yüksek kaliteli araçlara bakın.

jQuery Görüntü Slayt Gösterileri

Aşağıda en iyi jQuery slayt gösterilerini bulacaksınız. Genellikle en önemli kısımları en şık şekilde sunmak için web sitesinin üst kısmında slayt gösterileri kullanılır.

1.Avia Kaydırıcısı

5. Sıra JS (Ücretsiz)

Sıra, CSS çerçevesine dayalı bir JavaScript kaydırıcısıdır.

8. Slayt Gösterisi 2 (Ücretsiz)

Slayt gösterisi 2 resim galerisi

Slideshow 2, Mootools 1.2'nin web sitenizdeki görüntülerin sunumunu yayınlaması ve canlandırması için bir JavaScript sınıfıdır. Tam özellik listesi için lütfen web sitelerini ziyaret edin.

9. JavaScript TinySlideshow (Ücretsiz)

Çok basit bir görüntü kaydırıcı çözümü.

Bu dinamik JavaScript slayt gösterisi, hafif (5kb) ve ücretsiz bir resim galerisi / slayt gösterisi komut dosyasıdır.

Görüntüleri otomatik olarak görüntülemek, kaydırma hızını, küçük resim opaklığını ayarlamak veya küçük resim kaydırıcısını devre dışı bırakmak için kolayca ayarlayabilirsiniz. Çok hafif olduğu için bu koleksiyona dahil etmek istedim. Bu slayt gösterisini indirmek ve canlı önizlemesini görmek için buraya tıklayın.

jQuery Resim Galerileri

Bu bölümde Resim Galerilerini bulacaksınız. Portföyler için en uygun olanlardır, ancak bloglarda da kullanılabilirler. Hadi bakalım.

10. Galleria

12 Görsel Işık Kutusu

16 Unite Galeri

17. Otomatik Oluşturma Galerisi

18. HighSlideJS

19. Düz tarz Polaroid galerisi

jQuery Görüntü Kaydırıcıları

Bu bölüm, en iyi ve en güzel kaydırıcılara, premium ve ücretsiz kabinlere ayrılmıştır. Slayt Gösterileri ile benzer bir iş yaparlar, ancak içerik sahiplerini vurgulayabilirler.

20. Etkin RoyalSlider'a dokunun

21.Katman Kaydırıcısı

LayerSlider Duyarlı jQuery Slider Eklentisi.

22. Kaydırıcıyı Uno

23. Ana Kaydırıcı

Ana Kaydırıcı – jQuery Dokunmatik Kaydırıcı Kaydırıcı

26. Akordeon Kaydırıcı

Accordion Slider – piyasadaki en iyi jQuery akordeon kaydırıcısı.

Resimlerinizi veya resimlerinizi göstermenin basit bir yoludur, ancak sizi şaşırtacak kadar güçlüdür. Kullanımı ücretsizdir. Buna bir bak.

28. Hepsi Bir Arada Kaydırıcı

29. Yabanmersini Görüntü Kaydırıcısı

Yaban mersini jQuery görüntü kaydırıcısı

Blueberry image slider, duyarlı web tasarımı için özel olarak geliştirilmiş bir jQuery eklentisidir. Blueberry image slider, cssgrid.net'ten 1140px ızgara sistemine dayanan açık kaynaklı bir projedir. Bu basit ve aynı zamanda mükemmel bir ücretsiz seçenek.

Eminim siz de benim kadar beğeneceksiniz. Canlı önizleme ve indirme seçeneğini kontrol edin.

30. Gergedan Kaydırıcısı

Rhinoslider kaydırıcı - En esnek kaydırıcı

37. Küp Portföyü - Duyarlı jQuery Grid Eklentisi

38.Slayt

jQuery slayt gösterisi

Bu jQuery eklentisi, çalışmanızı sunmak veya hakkınızda daha fazla şey söylemek için web sitesinin en üstünde olması için harika.

Slideme, her tür cihaz için ayrı ayrı kaydırıcınızı nasıl ayarlayacağınız konusunda eksiksiz belgelere ve bir eğitime sahiptir. Tasarım, CSS3 animasyonları ile tamamen duyarlıdır. Kurulumu kolaydır ve genel bir API sağlar.

Slideme'in kullanımı ücretsizdir ve kesinlikle bir göz atmaya değer. Demoya buradan göz atın.

39.PgwSlider

Pgw kaydırıcısı, resimlerinizi sergilemek için tasarlanmış bir jQuery kaydırıcısıdır. Bu kaydırıcı tamamen duyarlı. Hafiftir ve tüm tarayıcılarla uyumludur. Pgw kaydırıcı ayrıca SEO dostudur.

Bu kaydırıcı, en son yayınınızı veya makalelerinizi gösterebileceğinden, haberler veya blog web siteleri için çok uygundur.

40. Tüm İçerik Kaydırıcısı

41.Lens Kaydırıcısı

Lens Slider jQuery ve WordPress eklentisi

Lens Slider açık kaynaklı bir projedir ve bu nedenle tamamen özelleştirilebilir. Slider, sırasız bir listenin çok basit HTML işaretlemesini kullanır. Resimler, ekran görüntüsünde gördüğünüz gibi gösterilmektedir. Başka bir seçenek mevcut değildir. Lens Slider ayrıca bir WordPress eklentisi olarak mevcuttur ve kullanımı ücretsizdir.

En uygun kullanım ürün, hizmet veya ekip sunumu için olacaktır.

Buradan kontrol edin.

42. Izgara

Gridder jQuery ve Ajax eklentisi

Gridder, çalışmanızı sergilemek için harika bir kaydırıcıdır. Gridder türü Google görsel aramasını taklit eder. Daha büyük resmi görmek için bir küçük resme tıklarsınız ve resim genişler. Bu, aynı anda çok sayıda görüntüyü göstermenin harika bir yoludur.

Gridder, jQuery veya Ajax küçük resim önizleyicisi olarak mevcuttur. Bir sonraki portföy projeniz için harika bir ücretsiz çözüm.

jQuery canlı önizleme için burayı kontrol edin. Ajax istiyorsanız buraya tıklayın.

43. Kışla Slayt Gösterisi 0.3

Barack JS - JavaScript slayt gösterisi

Barack Slideshow, JavaScript ile yazılmış zarif, hafif bir slayt gösterisidir. Bu slayt gösterisi dikey, yatay ve düzensiz listelerle çalışabilir. Görüntüler MooTool Assets ile önceden yüklenmiştir. Kodunuzu temiz tutmak için CSS kodunu kontrol etmelisiniz. Bu, gerekirse bazı parçaları değiştirmek anlamına gelir.

Barack Slideshow, portföy vitrini, ürün listesi ve hatta müşterilerinizi listelemek için kullanılabilir.

Burada bir demo bulabilir ve farklı seçenekleri test edebilirsiniz.

44.jQZoom Evrimi

JQ Yakınlaştırma Evrimi

JQZoom, popüler jQuery JavaScript çerçevesinin üzerine inşa edilmiş bir JavaScript görüntü büyütecidir. jQZoom, görüntünüzün bölümlerini büyütmek için harika ve kullanımı gerçekten kolay bir komut dosyasıdır.

Bu görüntü büyüteci, çevrimiçi mağazalar ve restoran menüleri için en uygun olanıdır.

Belgeleri ve demoyu burada bulabilirsiniz.

45. Multimedya Portföyü 2

Multimedya Portföyü 2 - jQuery kaydırıcısı

Multimedia Portfolio 2, her medya dosyasının uzantısını otomatik olarak algılayabilen ve uygun oynatıcıyı uygulayabilen bir jQuery eklentisidir. Görüntüleri ve videoları destekler. Multimedya Portföyü basit HTML işaretlemesi kullanır ve kullanımı kolaydır.

Bu kaydırıcı, ürünleri, hizmetleri ve hatta haberleri sergilemek için en uygun olanıdır.

46. ​​​​jQuery Sanal Turu

jQuery sanal turu

jQuery Virtual tour, basit panorama görüntüleyicinin bir uzantısıdır. Bu jQuery sanal turu, bazı panoramik manzaraları sanal bir tura dönüştürmenize olanak tanır! Bakmaya değer harika bir eklenti.

47.jQuery Dikey Haber Kaydırıcısı

Dikey Haber kaydırıcısı – jQuery eklentisi

jQuery Vertical News kaydırıcısı, sitelerinde bazı haberleri veya pazarlama kampanyalarını göstermek isteyen web siteleri için çok kullanışlıdır. Duyarlıdır ve CSS3 animasyonlarını kullanır. Dikey Haber kaydırıcısı, kaydırıcının stilini tamamen özelleştirmenize de olanak tanır.

48.Çok Öğe Kaydırıcısı

CSS Tabanlı Galeriler

En saf CSS Tabanlı Galerileri bulacağınız son bölümümüze geldik. O kadar popüler olmayabilirler ama kesinlikle denemeye değer. Kendiniz görün.

49. HoverBox Resim Galerisi

HoverBox Resim Galerisi

HoverBox Resim Galerisi, temel olarak, CSS'den başka hiçbir şey kullanmayan, süper hafif (8 kb) bir roll-over fotoğraf galerisidir. Daha hızlı yükleme için küçük resim ve roll-over önizleme için yalnızca bir görüntü kullanır. Tüm büyük tarayıcılar desteklenir. HoverBox Resim Galerisi, kendi projeleriniz için ücretsizdir.

En iyi fotoğrafçılar, her türlü portföy ve restoran menüleri için bir fotoğraf vitrini olarak kullanılır.

50. 3-D geçişli CSS Görüntü kaydırıcısı

51. CSS3 Hareketli Resim Galerisi

53. Saf CSS3 Resim Galerisi

Saf CSS3 Resim Galerisi

Bu, resme tıkladığınızda bir açılır pencere efekti yaratan basit bir CSS3 resim galerisidir. Web sitelerinde portföyleri sergilemek için uygundur. Eğer ilgileniyorsanız, kendiniz yapmak için öğreticiyi de takip edebilirsiniz.

Canlı önizlemeye göz atın.

54. CSS Işık Kutusu Resim Galerisi

CSS Lightbox resim Galerisi saf CSS

Bu resim galerisi başka bir saf CSS galerisidir. Tıklandığında resimleri uzaklaştırır. Kaynak kodunu indirebilir veya beğendiyseniz öğreticiye gidebilirsiniz..

CSS Lightbox resim Galerisi, kaydırılamaz bir web sitesinde kullanılmalıdır. Ancak, bu, öğreticinin sonunda yer alan tek bir JavaScript satırı ile geçersiz kılınabilir. En uygun kullanım bir portföy vitrini olacaktır.

55. Kaydırak

Slidea – Daha Akıllı Duyarlı Bir Slider Eklentisi

Ve işte bu koleksiyonun bir cevheri, Slidea. Slidea, çok amaçlı bir içerik kaydırıcısıdır. Bu kaydırıcı eklentisi jQuery, VelocityJS ve Animus animasyon çerçevesi üzerine inşa edilmiştir. Slidea ile animasyon sınırlaması yoktur - onunla çok fazla harikalık yapabilirsiniz!

Ne kadar havalı olduğunu açıklamaya çalışabilirim, ancak aşağıdaki demoyu kontrol edin ve neden bu kadar çok sevdiğimi anlayacaksınız!

Çözüm

Bu eklentileri araştırmaktan gerçekten keyif aldığımı söylemeliyim. Umarım bir sonraki projeniz üzerinde daha verimli çalışmanıza yardımcı olacak harika kaydırıcılar bulduk. Burada her durum için bir şey var.

O kadar çok şaşırtıcı kaydırıcı ve slayt gösterisi var ki, neyin tam olarak belirleneceğine karar vermek zor. Ama bence Gridder kaydırıcısını kesinlikle kontrol etmelisiniz, çünkü özellikle ücretsiz olarak yapabilecekleri gerçekten şaşırtıcı, bu yüzden bir kazan-kazan durumu.

Ve kesinlikle Slidea'yı da unutmamalısınız. Evet, birinci sınıf bir kaydırıcıdır, ancak o kadar çok değer taşır ki, yatırıma değer!

Makalemizi beğendiyseniz, yorum yapın, arkadaşlarınızla paylaşın ve favori kaydırıcınızı kaçırıp kaçırmadığımızı bize bildirin.

Favori galeri eklentiniz hangisi? Deneyimlerinizi duymak isteriz!

Yaratıcı Bültenimiz

Popüler haber bültenimize abone olun ve en son web tasarım haberlerini ve kaynaklarını doğrudan gelen kutunuza alın.

Merhaba sevgili okuyucular a! Bu derste size minimalist ama aynı zamanda rahat ve işlevsel bir tasarımın nasıl oluşturulacağını göstereceğim. jQuery fotoğraf galerisi veya istediğiniz gibi bir resim galerisi. Galeri, kategoriler oluşturma ve ardından filtreleme özelliğine sahiptir. Slayt gösterisi yapmak da mümkündür. Galeri tüm tarayıcılarda çalışır, bu nedenle uyarlama ile ilgili herhangi bir sorun olmayacaktır.

Bu galeriyi oluşturmak için iki ücretsiz kitaplık kullanılacaktır: bataklık ve Güzel fotoğraf. Galerinin oluşturulmasını büyük ölçüde basitleştirirler. Her zaman olduğu gibi, çalışmanın sonucunu demo sayfasında görebilir, ayrıca arşivi çalışma galerisinden ve tüm kaynak dosyalarından indirebilirsiniz. Tek olumsuz, eğer söyleyebilirsem, büyük resimler için küçük resimlerin manuel olarak oluşturulmasıdır. Diğer her şey için bu galeri dikkat etmeye değer. Birlikte !

HTML işaretlemesi

Öncelikle kategori listesi ile paneli analiz edelim, bu madde işaretli bir liste ul . Ayrıca, listenin her elemanı benzersiz bir sınıf adına sahip olmalıdır.

1 2 3 4 5 6 7 8 9 10 11

Resim adı yayınlandı: 2012

Yukarıda belirtildiği gibi, liste öğeleri galerideki resimlerdir. Listenin her öğesi bileşenleri içerir. Bu, görüntünün kendisi veya daha doğrusu küçük resmi ve açıklamasıdır. Küçük resim, ana resme bir bağlantıdır. Javascript'i çağırmak ve ana görüntüyü açmak için rel niteliği gereklidir.

Ayrıca 2 önemli şeyi de unutmayın, li list öğesinin benzersiz bir data-id özniteliği olmalıdır. data-type özniteliği, listesini yukarıda açıkladığım kategori sınıfını içerir. Her şey işaretleme ile ilgili gibi görünüyor.

CSS stilleri

Hazır bir kütüphane kullandığımız için stillere odaklanmayacağım. Güzel fotoğraf, görüntüyü arttırmaktan sorumludur ve çok fazla css kodu vardır. Bununla birlikte, ideal olarak sadece 3 olmasına rağmen, büyütülmüş görüntü için 5 tasarım seçeneği olduğunu belirtmekte fayda var, çünkü iki seçenekte sadece yuvarlama kaldırılıyor.

Bu nedenle, küçük resimler ve kategoriler listesi için sadece CSS stillerini göstereceğim.

Prensip olarak, stillerle her şey açık olmalıdır. Kategorileri hizalamak için display özelliği satır içi olarak ayarlanır. Görüntüye kontur efekti vermek için arka plan rengi (beyaz) ve 10 piksellik dolgu ayarlanır. Liste öğesi boyutları .portfolio-area li içinde ayarlanır.

jQuery

Ve son olarak, tüm ders uğruna en önemli şey. Bu jQuery kodudur. Resimleri kategoriye göre filtreleyerek başlayalım.

Clone() yöntemini ve bir seçiciyi kullanarak, .portfolio-area'nın tüm alt öğelerini seçip $data değişkenine yazıyoruz. Ardından, .portfolio-categ sınıfıyla listenin li öğesi olan kategorilerden birine tıklamayı izliyoruz. RemoveClass("active") öğesini kaldırarak tüm kategorileri etkisiz hale getiriyoruz, bu yapılmazsa, zamanla tüm kategoriler aktif olacak ve filtreleme duracaktır.

Liste elemanına tıkladığımız için, bu seçici liste elemanını içerir, yani li , ondan sınıf niteliğinin değerini alırız ve sınıf adını birkaç parçaya bölmek için split yöntemini kullanırız, sınır bir boşluktur (yani li . eğer sınıf “tümü aktif” ise, bölmeden sonra bir “tümü” ve “etkin” dizisini alırız). Ardından, dilim yöntemini kullanarak dizinin ilk öğesini (bizim durumumuzda “tümü”) seçeriz ve elde edilen sonucu filterClass değişkenine yazarız. Boşluk yoksa sınıf adı değişmez.

Ardından, filterClass değişkenindeki dizenin tüm, sonra .find yöntemini kullanarak, yukarıda ele aldığımız $data dizisinden portföy-item2 sınıfına sahip tüm öğeleri seçiyoruz. Seçilen öğeler (ve bunların tümü listenin öğeleridir, yani tüm resimlerdir) filteredData değişkenine yerleştirilir.

Aksi takdirde, filterClass eşit değilse tüm, sonra filterData değişkenine listenin tüm öğelerini değil, yalnızca veri türü özniteliği kategori sınıfıyla eşleşenleri koyacağız. Kısacası, yalnızca bir kategorinin öğeleri.

Ve son olarak ortaya çıkan değişkeni kütüphaneye aktarıyoruz. jquery bataklık, görüntü filtreleme gerçekleştirir. Her şey filtrelemeyle ilgili.

Şimdi, açılır penceredeki görüntünün yakınlaştırılmasıyla ilgili. Burada her şey çok daha basit.

rel niteliği nicePhoto ile başlayan bir bağlantıya yapılan tıklamayı izler. Sonra kütüphane devreye giriyor. güzel fotoğraf ve görüntü mucizevi bir şekilde büyür. Bu arada, birkaç parametre de geçiyoruz. Animasyon hızının hızlı olması, slayt gösterisindeki gecikmenin 5 saniye olması, Facebook temasının (toplamda 5 tane var, resimlerde / PrettyPhoto klasöründe var) olması gibi ve ayrıca resmin adının gösterilmesini ve arttırılmasını da yasaklıyoruz. üzerine gelindiğinde resim. için eksiksiz belgeler güzel fotoğraf bulunabilir

En son makaleler ve derslerden haberdar olmak için abone olun

Resim galerileri ve kaydırıcılar, en popüler jQuery formatlarından bazılarıdır. Onlar sayesinde, değerli alandan tasarruf ederken siteye gerekli miktarda görsel içerik ekleyebilirsiniz.

Galeriler ve kaydırıcılar sayfayı daha az kalabalık hale getirir, ancak yine de mesajı iletmek için ihtiyacınız olan tüm resimleri eklemenize izin verir. Özellikle çevrimiçi mağazalar için faydalı olacaktır.

Bugünün makalesinde, sizin için en iyi resim galerilerini ve jQuery kaydırıcılarını bir araya getirdik.

Bunları yüklemek için, seçilen eklentileri jQuery kitaplığıyla birlikte HTML sayfasının baş bölümüne ekleyin ve bunları belgelere göre yapılandırın (sadece birkaç satır kod).

Bu öğelerden hangisinin projenize tam olarak uyacağını seçin.

1. Önyükleme Kaydırıcısı

Bootstrap Slider, dokun ve kaydır kaydırma özelliğine sahip, mobil cihazlar için optimize edilmiş ücretsiz bir görüntü kaydırıcıdır. Herhangi bir ekranda ve herhangi bir tarayıcıda harika görünecek. Kaydırıcılara resim, video, metin, küçük resim ve düğmeler yükleyebilirsiniz.

2. Ürün Önizleme Kaydırıcısı

Ürün Önizleme Kaydırıcısı, jQuery'nin tüm potansiyelini bünyesinde barındırır, her arayüze mükemmel şekilde uyar. Bu eklentinin kodunun kalitesinden ve temizliğinden de memnun kalacaksınız.

3. Genişletilebilir Resim Galerisi

Genişletilebilir Resim Galerisi, tek bir tıklamayla tam ekran galeriye dönüşen harika bir eklentidir. "Hakkımızda" bölümü için veya ürün bilgilerini görüntülemek için kullanılabilir.

4. Fotorama

Fotorama, hem masaüstü hem de mobil tarayıcılar için çalışan duyarlı bir jQuery galeri eklentisidir. Çok sayıda gezinme seçeneği sunar: küçük resimler, kaydırma, ileri ve geri düğmeleri, otomatik slayt gösterileri ve işaretçiler.

5. Sürükleyici Kaydırıcı

Sürükleyici Kaydırıcı, Google TV kaydırıcısına benzer benzersiz bir slayt görüntüleme deneyimi oluşturmanıza olanak tanır. Ana fotoğraflara odaklanmak için arka plan görüntüsünü bulanık olacak şekilde değiştirebilirsiniz.

6. En az

Leastjs, harika bir galeri oluşturmanıza yardımcı olacak duyarlı bir jQuery eklentisidir. Resmin üzerine geldiğinizde metin görünür, tıkladığınızda pencere tam ekrana genişler.

7. Kayar Panel Şablonu

Bu eklenti portföyler için mükemmeldir. Seçilen içeriğin bağlanacağı yatay (küçük ekranlarda dikey) görüntü blokları oluşturacaktır.

8. Squeezebox Portföy Şablonu

Squeezebox Portföy Şablonu, portföy hareket efektleri sunar. Ana görüntünün (veya bloğun) üzerine geldiğinizde bağlantılı öğeler görünür.

9. Resimleri Karıştır

Shuffle Images, fareyle üzerine gelindiğinde değişen resimlerle bir galeri oluşturmanıza olanak tanıyan harika bir duyarlı eklentidir.

10. Ücretsiz jQuery Lightbox Eklentisi

Ücretsiz jQuery Lightbox Eklentisi, bir veya daha fazla resmi bir sayfada göstermenize yardımcı olur. Ayrıca büyütülebilir ve orijinal boyutlarına döndürülebilirler.

11. PgwSlider - jQuery için duyarlı kaydırıcı

PgwSlider minimalist bir görüntü kaydırıcısıdır. jQuery kodu küçüktür, bu nedenle bu eklentinin yükleme hızı sizi hoş bir şekilde şaşırtacaktır.

12. Dağınık Polaroidler Galerisi

Scattered Polaroids Gallery, harika bir düz tasarım kaydırıcıdır. Görüntüleri değiştirirken öğeleri rastgele hareket ediyor, bu da harika görünüyor.

13. Bouncy İçerik Filtresi

Bouncy Content Filter, portföyünüz için mükemmel bir çözümdür. Bu eklenti, kullanıcıların bir kategoriden diğerine hızlı bir şekilde geçmelerini sağlar.

14. Basit jQuery Kaydırıcısı

Basit jQuery Slider, adının hakkını veriyor. Bu eklenti JavaScript, HTML5 ve CSS3 öğelerini birleştirir. Demoda, varsayılan olarak yalnızca metin yükleme mevcuttur, ancak birkaç değişiklikle görsel içerik de eklenebilir.

15. Kaydır JS

Glide JS, basit, hızlı ve duyarlı bir jQuery kaydırıcısıdır. Kurulumu kolaydır ve eklenti fazla yer kaplamaz.

16. Paralakslı tam ekran sürükle-kaydırıcı

Bu harika jQuery görüntüsü ve metin yükleme kaydırıcısı, herhangi bir web sitesi için mükemmeldir. Hafif bir paralaks efekti ve yavaş metin görünümü ile kullanıcıları memnun edecek.