Resmin üzerine gelindiğinde jquery açılır başlığı. Web geliştiricileri için bir dizi yararlı jQuery Ajax CSS3 hilesi

1.jQuery Hover Yakınlaştırma Eklentisi

Yakınlaştırma efektini kullanarak fareyle üzerine gelindiğinde görüntülerin açıklamasını uygulamak için orijinal bir çözüm.

2. "Captify" Eklentisi

Galerideki resimlerin 3.jQuery açıklaması

İmleci üzerine getirdiğinizde, görüntünün bir açıklaması belirir ve görüntünün kendisi belirli bir rengin yarı saydam bir katmanıyla doldurulur.

4.jQuery resim altyazılarının uygulanması

Fare imlecini bir resmin üzerine getirdiğinizde görünen resimler için resim yazısı uygulamak için çeşitli seçenekler.

5.jQuery sürgülü kapı efekti

Bir küçük resmin üzerine geldiğinizde, onun yerinde etkili bir şekilde bir açıklama görünür.

6. jQuery eklentisi "Zoominfo"

Fareyle bir görüntünün üzerine geldiğinizde küçülür ve fotoğrafın adı ve açıklaması belirir.

7. jQuery eklentisi "Mozaik"

Fareyle üzerine gelindiğinde görüntülerin açılır açıklamalarının uygulanması. 8 farklı açılır imza türü vardır. Bunları demo sayfasında görebilirsiniz.

Fare imlecini görüntünün üzerine getirdiğinizde, dışarı kayar Kısa Açıklama ayrıntılı bilgi için bir bağlantı ile.

9. Görüntü imzasını uygulamak için eklenti

Fareyle üzerine gelindiğinde açılır resim resim yazılarını uygulamak için başka bir seçenek. Aralarından seçim yapabileceğiniz iki jQuery altyazı efekti vardır.

10. "Önizleme penceresi" resimlerinin açıklaması

Görüntüleri imzalamak için eklenti. Fare imlecini animasyonlu bir efektle gezdirdiğinizde, görüntünün bir açıklaması görünür. Animasyonu oluşturmak için JQuery kullanılır.

Malzemelere göre hazırlanır

jQuery eklentileri, bir web sitesi veya herhangi bir web uygulaması oluştururken en önemli bileşenlerden biridir. İşlevselliğinizi genişletmenize izin verirler. Bu makale, 2012'deki en kullanışlı eklentileri listeler. Daha uygun bir arama için tüm eklentiler aşağıdaki kategorilere ayrılır: Web Sayfası Düzeni - eklentiler, gezinme eklentileri, Form Eklentileri, kaydırıcı oluşturmak için eklentiler, çizelgeler ve grafikler için eklentiler, resimler için efektler ve diğerleri. Ayrıca bu eklentiler arasında, duyarlı uygulamalarınızı oluşturmanıza yardımcı olacak eklentiler de bulunmaktadır.

Sayfa Düzeni eklentileri

equalize.js oluşturmanıza izin veren bir jQuery eklentisidir. blok yapısı alan. Herhangi bir öğenin yüksekliğini ve genişliğini hizalamanıza olanak tanır.

Duyarlı düzenler için yeni eklenti Freetile, sabit boyutlu ızgara sütunları oluşturma ihtiyacını ortadan kaldırırken herhangi bir boyutta öğe oluşturmanıza olanak tanır.

Sürükleme oluşturmak için Gridster.JS jquery eklentisi ve bırak- ağlar. Ayrıca, ızgaradan öğeleri dinamik olarak kaldırmanıza ve eklemenize olanak tanır.

Zoomooz.js bir web sayfasının herhangi bir öğesini büyütmek için kullanımı kolay bir jQuery eklentisidir. Herhangi bir HTML öğesine "zoomTarget" sınıfını ekleyerek kolayca yakınlaştırma efekti ekleyebilirsiniz. Büyütme, sayfaya tıklanarak sıfırlanabilir. Eklenti şurada test edildi: Internet Explorer 9, Safari 3+, Firefox 3.6+, Opera ve Chrome.

Wookmark, dinamik bir çok sütunlu şablon oluşturmak için bir eklentidir.

jQuery HiddenPosition, gizli olsa bile herhangi bir öğe eklemenize izin veren bir eklentidir.

Stellar.js, öğeler için paralaks etkisi sağlayan bir jQuery eklentisidir.

Bölümler arasında gezinirken gerçek bir sayfa çevirme efekti ekleyen bir jQuery eklentisi. Tarafından kullanılan donanım ivmesi... Tabletlerde ve akıllı telefonlarda çalışır.

Duyarlı tipografi için eklenti. İdeal yazı tipi boyutunu oluşturan bir seçici kullanmanıza olanak tanır.

Tüm olası dönüşümler dahil olmak üzere site çevresinde hareketli hareketler oluşturmanıza olanak tanır

Navigasyon eklentileri

HorizontalNav, yatay menüyü kabın tüm genişliğine uyacak şekilde genişleten bir jQuery eklentisidir. Bir projede bir gezinme menüsünü bir CSS kapsayıcısına düzgün bir şekilde genişletmenin etkisini yaratmayı denediyseniz, tarayıcılar arası uyumluluğun ne kadar zor olduğunu kesinlikle bilirsiniz. Bu eklenti bunu kolaylıkla yapar.

stickyMojo, jQuery'deki hafif, hızlı ve esnek bir yapışkan kenar çubuğu eklentisidir. Firefox, Chrome, Safari ve IE8 + ile çalışır (IE'nin eski sürümlerini oldukça iyi destekler).

ddSlick, resimler ve açıklamalar içeren açılır menüler oluşturmanıza izin veren bir eklentidir.

Açılır panellerin kolay organizasyonu için eklenti. Eklenti, panellerin durumunu saklamak için çerezlerle çalışmayı destekler. Seçenekler arasında bölümlerin açılmasını ve kapanmasını yapılandırmak için geri dönüş işlevleri vardır.

Sınırlı bir alanda herhangi bir veri içerebilen daraltılabilir bloklar oluşturmak için eklenti.

Eklentileri şekillendirme

Eklenti, şifre karmaşıklığı seviyesini tanımlamanıza izin verir.

Dosya yükleme sürecini görselleştirmek için JQuery eklentisi. Sürükle ve bırak özelliğini destekler ve fotoğraflar için anında önizlemeler oluşturur.

Kredi kartı numaralarını algılayan ve doğrulayan eklenti. Kredi kartının türünü belirlemenizi sağlar.

Veri filtreleme eklentisi. Verileri etikete ve birden çok etikete ve kategoriye göre filtreleyebilirsiniz.

Girişi doğrulayan eklenti E-postaönceden hazırlanmış bir listeye göre doğruluk için (buraya en popüler olanları ekleyebilirsiniz) posta hizmetleri mail.ru, yandrex.ru, gmail vb.).

Sürgü ve karusel oluşturmak için eklentiler

Farenizi, dokunmatik yüzeyinizi ve klavyenizi kullanarak geçişleri kontrol etmenizi sağlayan eklenti. Yine kaynak dosyada bulunan varsayılan geçişlere ek geçişler ekleyebilirsiniz.

iosSlider

iosSlider, duyarlı tarayıcılar arası kaydırıcı için bir eklentidir.

RSlider, tam ekran duyarlı bir kaydırıcıdır. ÖEkranınızın genişliğine göre otomatik olarak ayarlanacaktır.

Fresco, duyarlı bir lightbox eklentisidir. Tüm ekran boyutlarında, tüm tarayıcılarda ve tüm cihazlarda harika çalışan çarpıcı kaplamalar oluşturmak için kullanılabilir.

BookBlock: İçerik Çevirme Eklentisi

BookBlock, sayfa çevirmeli gezinme oluşturmanıza olanak tanıyan kitapçık bileşenleri oluşturmak için kullanılabilen bir jQuery eklentisidir. Görüntü veya metin olsun, herhangi bir içerik burada kullanılabilir. Eklenti, yapıyı yalnızca gerektiğinde (başka bir deyişle, yalnızca sayfa çevrildiğinde) dönüştürür ve gerçek görünmesi için bindirmeler ve gölgeler kullanır.

Adapter, geliştiricilerin güzel 2D veya 3D slayt döndürme animasyonları oluşturması için basit bir arayüz sağlayan hafif bir içerik kaydırıcısıdır. Şu anda webkit ve Firefox tarayıcılarında 3D özellikler için destek var. Tüm 2D geçişler IE6+ ve diğer modern tarayıcılarda test edilmiştir.

Birkaç kullanışlı özelliğe sahip sürekli atlıkarınca.Son derece özelleştirilebilir ve hatta eski tarayıcıları destekler.

gergedan- oldukça esnek jQuery slayt gösterisi eklentisi. Sadece çeşitli efektler sunmakla kalmaz, aynı zamanda kaydırıcıya kendi stillerinizi, efektlerinizi ve fonksiyonlarınızı eklemek de mümkündür.

Sequence, içeriği orijinal bir şekilde kaydıran ve size tam kontrol sağlayan bir jQuery eklentisidir. Her türlü içerik kullanılabilir; durmadan kayar. Anlamsal işaretleme kullanır ve duyarlı şablonları ve dokunmatik tabanlı cihazları destekler.

Glisse.js basit, duyarlı ve son derece özelleştirilebilir bir jQuery fotoğraf galerisidir.

Çizelgeler ve grafikler için eklentiler

Morris.js, zaman serisi grafikleri çizmeyi kolaylaştırmak için jQuery ve Raphaël kullanan hafif bir kitaplıktır.

JQuery Org Chart, iç içe öğelerle ağaç yapıları oluşturmanıza olanak tanıyan bir eklentidir. Veriler, iç içe sıralanmamış bir listeye girilir ve bu da eklentinin kullanımını inanılmaz derecede kolaylaştırır.

Tipografi eklentileri

Bacon.js, metni bir Bézier eğrisi veya çizgisi etrafına sarmanıza izin veren bir jQuery eklentisidir.

Textualizer, metin üzerinde güzel efektler oluşturmak için bir jQuery eklentisidir. Desteklenen çalışma: Chrome, Safari 4+, Firefox 3.5+, IE 6,7,8,9+, Opera 10.6+, Mobil Safari (iOS 4)

SlabText, mevcut yatay alanı doldurmak için her satırı yeniden boyutlandırmadan önce başlıkları satır satır bölen çok kullanışlı bir jQuery eklentisidir.

trunk8 bir jQuery metin kesme eklentisidir. Önizleme için büyük bir metin bloğunu daha küçük bir bölüme küçültür.

Görüntüler için çeşitli efektler oluşturmak için eklentiler

Bu, bir eğim efekti oluşturmak için CSS3 filtrelerini kullanan bir jQuery eklentisidir.

Duyarlı görüntülerin etkisini uygulamak için eklenti.

Görüntü haritaları oluşturmayı kolaylaştıran jQuery eklentisi. Bu araçla, herhangi bir görüntü haritası vurgulanabilir veya seçilebilir ve harita üzerinde değişiklik yapılabilir. Farklı yollar... Internet Explorer 6 dahil tüm büyük tarayıcılarda çalışır, Flash kullanmaz ve jQuery'den başka bir şeye ihtiyaç duymaz. Bazı gelişmiş efektler HTML5 desteği gerektirir, ancak yine de eski tarayıcılarda çalışır.

Responsive veya isterseniz responsive web tasarımı artık sadece bir tasarım trendi değil, halihazırda web sitelerinin evrenselliğini, çeşitli kullanıcı cihazlarının ekranlarında uyumlu bir görsel algıyı sağlayan bir tür web sitesi geliştirme standardıdır. Daha yakın zamanlarda, geliştirme sırasında duyarlı şablon, genel tasarım stilini bozmadan belirli kaydırıcıları ve resim galerilerini entegre etmenin çeşitli zorluklarıyla uğraşmak zorunda kaldım. Artık her şey çok daha basit, ağ var büyük miktar hazır çözümler ve özellikle sevindirici olan, çoğu ücretsiz, açık kaynak kodu.

Sunulan araçların çeşitliliği nedeniyle, uyarlanabilirlikteki en dikkate değer gelişmelere ilişkin küçük bir genel bakış derledim. jQuery kaydırıcısı en son görüntüler ve herhangi bir kısıtlama olmaksızın dağıtılır, yani. Tamamen ücretsiz.

Vay kaydırıcı

Çok çeşitli görsel efektler (dönüşler, kalkışlar, bulanıklık, spiraller, panjurlar, vb.) ve daha pek çok şey içeren duyarlı jQuery görüntü kaydırıcısı hazır şablonlar... WOW Slider'ın yerleşik sayfa ekleme sihirbazı ile dakikalar içinde kolayca ve kolayca çarpıcı slayt gösterileri oluşturabilirsiniz. Geliştiricinin sitesi, eklentiyi Rusça olarak kurmak ve kullanmak için gerekli tüm belgeleri, eklenti çalışmasının mükemmel canlı örneklerini içerir. Ayrı bir Wordpress eklentisi ve Joomla için bir modül de indirilebilir. Hem yeni başlayanlar hem de ileri düzey web yöneticileri olan birçok kişinin bu harika kaydırıcıyı beğeneceğinden eminim.

HiSlider

HiSlider - HTML5, jquery kaydırıcı ve resim galerisi, yönetilen web sitelerinde kişisel kullanım için tamamen ücretsiz eklenti popüler sistemler- WordPress, Joomla, Drupal. Bu basit ama oldukça işlevsel aracın yardımıyla, sitelerinizin sayfalarında şaşırtıcı ve canlı slayt gösterileri, etkili sunumlar ve yeni mesajların duyurularını kolayca oluşturabilirsiniz. Kaydırıcı için çeşitli hazır şablonlar ve görünümler, içeriğin çarpıcı geçiş (değişim) efektleri, çeşitli multimedya içeriğinin çıktısı: YouTube ve Vimeo'dan videolar, esnek özel ayarlar vesaire...

Nivo kaydırıcı

Nivo Slider eski güzel, konuyla ilgili herkes tarafından iyi bilinen, en güzel ve kullanımı kolay resim kaydırıcılarından biridir. MIT lisansı altında dağıtılan jQuery Nivo Slider eklentisini indirmek ve kullanmak ücretsizdir. WordPress için ayrı bir eklentisi de var ama ne yazık ki zaten ücretli ve bir lisans için 29 dolar ödemeniz gerekecek. WP tema dosyalarıyla biraz sihir yapmak ve Nivo Slider eklentisinin ücretsiz jQuery sürümünü blogunuza eklemek daha iyidir, çünkü internette bunun nasıl yapılacağına dair yeterli bilgi vardır.
İşlevselliğe gelince, her şey bununla uyumludur. İş için jQuery v1.7 + kitaplığı kullanılır, güzel geçiş efektleri, basit ve çok esnek ayarlar, duyarlı düzen, otomatik görüntü kırpma ve çok daha fazlası.

Kaydırıcı fikri, birkaç küçük nesnenin (resimlerin) basit bir animasyon efekti ile seçilen kategoriye tıklayarak değiştiği Apple ürünlerinin sunum stili ile tanınan geliştiricilerden ilham aldı. Codrops size bu kaydırıcının nasıl oluşturulacağı hakkında ayrıntılı bir eğitim, eksiksiz bir HTML düzeni, bir dizi CSS kuralı ve yürütülebilir bir jQuery eklentisinin yanı sıra kaydırıcıyı kullanmanın harika bir canlı örneği sunar.

yarık kaydırıcı

jQuery ve CSS3'te tam ekran görüntü kaydırıcısı + eklentiyi site sayfalarına entegre etme hakkında ayrıntılı bir eğitim. Buradaki fikir, bir sonraki veya önceki içeriğe giderken mevcut slaydı belirli içerikle dilimleyerek açmaktır. jQuery ve CSS animasyonları ile benzersiz slayt geçişleri oluşturabilirsiniz. Duyarlı kaydırıcı düzeni, ekranlarda eşit derecede iyi görünmesini sağlar farklı şekiller kullanıcı cihazları

Elastik İçerik Kaydırıcısı

Bulunduğu ana kabın boyutuna bağlı olarak genişlik ve yüksekliği otomatik olarak ayarlayan içerik kaydırıcısı. Yürütmede oldukça basit ve ayarlarda esnek, jQuery tarafından desteklenen kaydırıcı, altta gezinme ile ekran boyutu aşağı doğru değiştirildiğinde, gezinme simgeler şeklinde görüntülenir. Çok ayrıntılı belgeler (oluşturma eğitimi) ve canlı kullanım örnekleri.

3B Yığın Kaydırıcısı

3B düzlemden geçişleri olan görüntüleri gösteren deneysel bir kaydırıcı. Görüntüler iki yatay yığına bölünür, gezinme okları yardımıyla her bir sonraki görüntünün değişimi ve izleme durumuna geçişi gerçekleştirilir. Genel olarak, özel bir şey yok, ancak fikrin kendisi ve uygulama tekniği oldukça ilginç.

Çok basit, %100 duyarlı ve tam ekran jQuery görüntü kaydırıcısı. Kaydırıcı, jQuery'nin büyüsü ile birlikte CSS geçişlerine (geçiş özelliği) dayanmaktadır. Maksimum genişlik varsayılan olarak %100'e ayarlanmıştır, bu nedenle resimlerin boyutu, ekran boyutundaki değişikliklere bağlı olarak değişecektir. Tasarımda özel animasyon efektleri ve incelikler yoktur, her şey basit ve sorunsuz çalışma için keskinleştirilmiştir.

Minimal slaytlar

Adı kendisi için konuşuyor, bu belki de karşılaştığım en hafif ve minimalist jQuery görüntü kaydırıcılarından biri (1kb'lik eklenti). DuyarlıSlides.js bir kap içindeki öğeleri kullanarak slayt gösterileri oluşturan küçük bir jQuery eklentisidir. IE6'dan itibaren ünlü ilerleme freni olan IE'nin tüm sürümleri de dahil olmak üzere çok çeşitli tarayıcılarla çalışır. Çalışma, güvenilirlik için javascript ile birlikte CSS3 geçişlerini kullanır. Sırasız bir liste kullanarak basit düzen, geçişleri ve zaman aralıklarını ayarlama, slayt değiştirmenin otomatik ve manuel kontrolü ve aynı anda birden fazla slayt gösterisi desteği. İşte çok eğlenceli bir "çocuk".

Kamera

Kamera, site sayfalarında slayt gösterileri düzenlemek için ücretsiz bir jQuery eklentisi, birçok geçiş efektine sahip hafif bir kaydırıcı, %100 duyarlı bir düzen ve çok basit ayarlar... Herhangi bir kullanıcı cihazının (PC monitörleri, tabletler, akıllı telefonlar ve cep telefonları). Gömülü videoyu gösterme yeteneği. Düğmeleri ve bir küçük resim bloğunu kullanarak otomatik slayt değiştirme ve manuel kontrol. Kompakt bir tasarımda neredeyse eksiksiz bir resim galerisi.

bxSlider jQuery

Oldukça basit bir duyarlı jQuery kaydırıcısı. Herhangi bir içerik, video, resim, metin ve diğer öğeler slaytlara yerleştirilebilir. Genişletilmiş destek dokunmatik ekranlar... CSS geçiş animasyonlarını kullanma. Çok sayıda farklı varyasyonlar slayt gösterilerinin ve kompakt resim galerilerinin sunumu. Otomatik ve manuel kontrol. Düğmeleri kullanarak ve küçük resimleri seçerek slaytlar arasında geçiş yapma. Kaynak dosyanın küçük boyutu, yapılandırması ve uygulaması çok kolay.

FlexSlider 2

FlexSlider 2 - Geliştirilmiş yanıt verme, komut dosyası küçültme ve en aza indirilmiş yeniden akış / yeniden çizme ile aynı adı taşıyan kaydırıcının güncellenmiş bir sürümü. Eklenti, temel bir kaydırıcı, küçük resimlerle kaydırma kontrolü, yerleşik sol-sağ oklar ve düğmeler şeklinde bir alt gezinme çubuğu içerir. Videoyu slaytlarda görüntüleme (vimeo), esnek parametre ayarları (geçişler, dekorasyon, zaman aralığı), tamamen duyarlı düzen.

Galleria

İyi bilinen ve oldukça popüler, duyarlı eklenti Yüksek kaliteli resim galerileri ve kaydırıcılar oluşturmak için jQuery. Kaydırıcı arayüzü, kontrol paneli sayesinde görsel olarak tanıdık bir video oynatıcıya benziyor, eklenti birkaç farklı tema içeriyor. Popüler hizmetlerden gömülü videolar ve resimler için destek: Flickr, Vimeo, YouTube ve diğerleri. Kurulum ve kullanım hakkında ayrıntılı belgeler.

Yaban mersini

Duyarlı web tasarımı için özel olarak yazılmış basit, zil ve ıslık içermeyen ücretsiz bir jQuery görüntü kaydırıcısı. Blueberry, deneysel bir açık kaynak jQuery eklentisidir. Minimalist tasarım, efekt yok, yalnızca belirli bir süre sonra birbirinin yerini alan sorunsuz açılır resimler. Her şey çok basit, kurun, prize takın ve gidin...

jQuery temel 2.1

Lightbox öğelerine sahip çok kompakt bir jQuery görüntü kaydırıcısı. Esnek boyutu nedeniyle, herhangi bir kapsayıcıya, küçük resimler şeklinde tek bir girişe, fare imlecini üzerine getirdiğinizde veya üzerine tıkladığınızda, büyütülmüş bir resim ve kontrollere sahip bir ışık kutusunun etkinleştirildiği çok kolaydır. Ürünleri veya haber duyurularını sunmak için böyle bir kaydırıcıyı kenar çubuklarına yerleştirmek uygundur. Büyük miktarda bilgi içeren siteler için mükemmel bir çözüm.

Sıra

Gelişmiş CSS3 geçişlerine sahip ücretsiz duyarlı kaydırıcı. Minimalist tarz, 3 tasarım teması, Her çerçeve yatay olarak kayar, ortada görünür, resim sola gider, imza sağa, küçük resimler sağ alt köşede çoğaltılır. Her çerçevede görüntülemek için ürün sunumlarının sayfalandırılması. Kontroller ayrıca geri ve ileri düğmeleri içerir. Tüm modern tarayıcılar tarafından desteklenir.

Tokatlamak

Hem işlevsellik hem de ayarlar açısından çok basit bir resim kaydırıcısı, ayarlardan slayt değiştirme hızında bir değişiklik var, bir manuel mod bağlanıyor (kontrol düğmeleri etkinleştirilir), sürekli bir slayt gösterisi. Bu kaydırıcının olma hakkı var ve beni sadece olduğu gerçeğiyle çekti, bu gelişmede özellikle ilginç bir şey bulamadım, belki de kötü görünüyordum)))

Duyarlı Görüntü Kaydırıcısı

Vladimir Kudinov ve arkadaşlarından böyle güzel, uyarlanabilir bir görüntü kaydırıcısı. Açıklayıcı örneklerle sağlanan sağlam, iyi geliştirilmiş bir araç ve detaylı talimatlar oluşturma, kurulum ve kullanım hakkında. Duyarlı tasarım, hoş yeşil düğmeler ve oklar, her şey baskı olmadan oldukça güzel ve sakin.

Kesir Kaydırıcısı

Resimler ve metin slaytları için ücretsiz jQuery paralaks kaydırıcı eklentisi. Slayt animasyonu, her zamanlama ve animasyon ayarında tam kontrole sahip çoklu gösteri değerlerine sahiptir. Bir slaytta aynı anda birkaç öğeyi canlandırabilme yeteneği. Farklı animasyon yöntemleri ayarlayabilir, slaytları soldurabilir veya belirli bir yönden geçişler yapabilirsiniz. Bir resmin üzerine geldiğinizde açılan gezinme oklarını kullanarak otomatik görüntüleme ve manuel kontrol. 10 çeşit slayt görünümü animasyon efekti ve çok daha fazlası...

İncelemenin oldukça kapsamlı olduğu, ancak söz konusu çok sayıda ürün nedeniyle yeterince bilgilendirici olmadığı ortaya çıktı. Tüm ayrıntılar ve ayrıntılı açıklamalar işlevsellik Belirli bir eklentiyi doğrudan geliştiricilerin sayfalarında öğrenebilirsiniz. Umarım birisinin, sitelerinin sayfalarında renkli resim kaydırıcıları oluşturmak için bu çok gerekli aracı bulmasını kolaylaştırmıştır.

Ruslaştırılmış şablonlarla çalışabilmenin güzel olup olmayacağını hiç merak ettiniz mi? Sadece bir dakika düşün. İngilizce şablonlarla çalışmak için zaman kaybetmeyin. Şimdi TemplateMonster pazarında bulabileceğiniz gerçeğiyle sizi memnun etmek için acele ediyoruz. Her birinin metni elle yazılmıştır. Ve elbette, tüm hazır çözümlerin kullanımı inanılmaz derecede kolaydır.

Tüm saygımla, Andrew

jQuery kullanarak fareyle üzerine gelindiğinde ilginç metin efekti.

Bir fanı andıran görüntü kaydırıcısının çok özgün tasarımı. Hareketli slayt değişimi. Görüntüler arasında gezinme oklar kullanılarak gerçekleştirilir. Üstte bulunan Oynat / Duraklat düğmesi kullanılarak açılıp kapatılabilen otomatik bir geçiş de vardır.

3. Sitedeki harika diyagram tasarımı

Raphaël JavaScript kitaplığı kullanılarak oluşturulan animasyonlu pasta grafiği.

Site için hafif CSS3 açılır menüsü.

Hareketli jQuery kaydırıcısı. Tarayıcı penceresi yeniden boyutlandırıldığında arka plan resimleri otomatik olarak ölçeklenir. Her görüntü için açıklama içeren bir blok açılır.

6. Sayfada arka plan jQuery animasyonu

İmleci ekran boyunca hareket ettirirken animasyonlu jQuery efekti.

7. "Blackbird" Eklentisi

JavaScript'teki alert() işlevine benzer işlevsel bir çözüm. Blackbird kullanımı hakkında daha fazla bilgiyi demo sayfasından okuyabilirsiniz.

8. "OpenFaces" JSF bileşenlerinin Ajax kitaplığı

Öğeler oluşturmak için açık kaynak JFS çerçevesindeki çeşitli Ajax bileşenleri kümesi Kullanıcı arayüzü... Bileşenler kümesi en yaygın arabirim öğelerini içerir: tablolar ve grafiklerle çalışmak için bileşenler, sekmeler, açılır pencereler, filtreler, menüler, takvimler, formlarla çalışmak için bileşenler ve diğer birçok Ajax çözümü. Demo sayfasında tüm bileşenleri çalışırken görebilirsiniz. OpenFaces iki tür lisans altında dağıtılır: ücretsiz ve ticari.

9. Kullanıcı arabirimi öğeleri oluşturmak için "Wijmo" jQuery UI widget'ları seti

Web geliştiricileri için profesyonel widget koleksiyonu. Wijmo paketi şu ücretsiz jQuery çözümlerini içerir: akordeonlar, takvimler, açılır iletişim kutuları, genişleticiler, biçimlendirilmiş formlar, çeşitli listeler, menüler, ilerleme çubukları, sekmeler, araç ipuçları ve diğer kullanışlı widget'lar. Geliştiriciler "Wijmo" teklifine ek olarak ücretsiz çözümler ayrıca yüksek kaliteli ticari jQuery UI geliştirmeleri. Arşivi indirdikten sonra, olası tüm widget'ları çalışırken görebilirsiniz, bunlar wijmo-open / geliştirme paketi / örnekler / dizinde bulunur. Bu set, web projelerinizi geliştirirken size tonlarca zaman kazandıracağından emin olabilirsiniz.

10. Arama alanını jQuery kullanarak tasarlama

Giriş alanının animasyonlu tasarımı arama sorgusu... Etki, giriş alanında fare ile tıklanarak gözlemlenebilir. Klavyeden bir sorgu girdikten sonra aramayı başlatma düğmesi görünür.

11. jQuery ve CSS3'te "Flux Slider" kaydırıcısı

12. Ölçeklenebilir metin jQuery "Sliding Letters"

Tarayıcı penceresinin boyutuna bağlı olarak ölçeklenebilir metin oluşturmak için eklenti. Tarayıcı penceresi ne kadar büyük olursa, metin boyutu da o kadar büyük olur.Bu efektin paragraflarda normal metinle kullanılmaması gerektiğini unutmayın. Yalnızca, örneğin promosyon sitelerinde büyük etiketlerin görüntülenmesi için uygundur. Demo sayfasında bir örnek görülebilir. Efekti görmek için pencereyi yeniden boyutlandırmayı deneyin.

13. "Garip" Slayt Gösterisi

İşlevsel slayt gösterisi. Slaytlar şeklinde olabilir: basit görüntüler, resim yazıları olan resimler, ipuçları içeren resimler, video klipler. Klavyenizdeki okları, slayt numara bağlantılarını ve sol/sağ tuşlarını kullanarak gezinebilirsiniz. Slayt gösterisi birkaç versiyonda yapılır: minyatürlü ve minyatürsüz. Tüm seçenekleri görmek için demo sayfasının üst kısmında bulunan Demo # 1 - Demo # 6 bağlantılarını takip edin.

14. jQuery eklentisi "jQueryZoom"

Bu eklenti ile üzerine gelindiğinde görüntüye yakınlaştırma efekti ekleyebilir veya üzerine bindirme ekleyebilirsiniz. Eklentiyi ihtiyaçlarınıza göre özelleştirmek kolaydır.

15. jQuery jSwitch Galerisi

Hareketli jQuery galerisi.

16. 3D efektli JavaScript galerisi

17. Galeri "jQuery geçiş galerisi"

Yeni jQuery kaydırıcısı. Slaytları değiştirirken birkaç harika animasyon efekti.

18. Yeni CSS3 Elma Stili Menüsü

Yeni Apple tarzı menü. Eskisinden daha koyu görünüyor ama daha az sevimli değil.

19. Araç ipuçlarının jQuery "Tooltipsy" içinde yeni uygulanması

Birçok farklı vurgulu araç ipucu efekti.

20. Mobil cihazlarda görüntülemek için JavaScript galerisi "PhotoSwipe"

Görüntülemek için optimize edilmiş resim galerisi mobil cihazlar(telefonlar veya tabletler).

21. Şık CSS3 Menüsü

22. jQuery eklentisi "Büyüteç"

Fareyle üzerine gelindiğinde görüntünün bir alanını büyütmenin etkisi.

23. Bir çevrimiçi mağaza için Ajax "Kolay Sepet" sipariş sepeti

PayPal veya Google Checkout kullanan ürünler için entegre ödeme yöntemlerine sahip bir çevrimiçi mağaza için işlevsel bir alışveriş sepeti. Kullanılan teknolojiler: HTML, CSS, jQuery, AJAX, PHP, XML, XSL. Bir web sayfasına yerleştirmek ve özelleştirmek kolaydır dış görünüş sepetler.

24. jQuery eklentisi "Grid Navigation Effects"

Resimlerin küçük resimleri arasında orijinal gezinme. Efekti demo sayfasının sağ tarafında görmek için Yukarı ve Aşağı düğmelerini tıklayın. Bu jQuery çözümü ayrıca küçük resim üzerinde fareyle üzerine gelme efekti sağlar.

25. Arka plan efekti "Dikey Paralaks"

5. Blokların görünümünü jQuery'ye çevirme

Bunun yardımıyla jQuery eklentisi"Görüntü Seçeneklerini Değiştir", sayfada, ziyaretçinin bilgi tablosu görünümünden bilgi ekranına geçeceği bir geçiş uygulayabilirsiniz. tam görüntü blokların bir açıklaması ile. Portföy uygulaması için mükemmeldir.

26. jQuery'de analog saat

27.jQuery HTML5 Portföyü

ile güzel bir portföyün uygulanması jQuery kullanarak ve HTML5. Uygulanan filtrede portföy çipi. Portföydeki çeşitli çalışmalar seçilen kategoriye göre görüntülenir.

28. Minyatürlü galeri "TN3 Galerisi"

jQyery küçük resim galerisi. Otomatik slayt değiştirmeyi devre dışı bırakma / etkinleştirme yeteneğinin yanı sıra kompakt bir pencerede ve bir pencerede tam ekranda görüntüleme yeteneği uygulandı.

29. "Önizleme penceresi" resimlerinin açıklaması

Görüntüleri imzalamak için eklenti. Fare imlecini animasyonlu bir efektle gezdirdiğinizde, görüntünün bir açıklaması görünür. Animasyonu oluşturmak için JQuery kullanılır.

30. JavaScript atlıkarınca

31. "Izgara-Galeri" görüntü ızgarası

36. Slayt gösterisi

Slaytın sağ üst köşesinde, otomatik slayt değiştirmeyi açıp kapatabilirsiniz.

37. "jbar" açılır menüsü

38. jQuery'de animasyonlu menü

Animasyonlu menü. Menü öğeleri, simgeler ve açıklamalar şeklinde sunulur. bir menü öğesinin üzerinde gezinmenin bazı harika etkileri. Hepsini görmek için 8 efekt vardır - demo sayfasındaki Exemple1-Exemple8 bağlantılarını takip edin.

39.jQuery slayt gösterisi

Orijinal görüntü değiştirme efektli slayt gösterisi.

40. Hareketli jQuery CSS3 efekti

41. jQuery Resim Galerisi

resim yazısı içeren jQuery galerisi. Birkaç slayt geçiş efekti. Görüntüler arasında gezinme, oklar yardımıyla veya bir küçük resme tıklanarak gerçekleştirilir.

Arka plan efekti (katmanlar arasında hareket). Etkiyi çalışırken görmek için demo sayfasında farenizi ekran boyunca sürükleyin.

43.jPaginator CSS3 Çağrı Eklentisi

44. Plazma Duvar Eklentisi

Fotoğraflardan veya HTML bloklarından, sabit bir alan içinde ekran boyunca fare ile sürüklenebilen bir tür "duvar" oluşturmak.