1. Slideshow Luar Biasa di JQuery "Slideshow Elastis"
Slideshow dengan miniatur dan deskripsi slide. Berbagai efek mengganti gambar. Ada dua opsi: dengan perubahan slide otomatis dan tanpa.
2. Slider CSS3 murni
Slider gambar lucu dengan deskripsi dan perubahan slide otomatis. Ketika Anda mengarahkan kursor, gambar rotasi berhenti. Berhenti disertai dengan efek CSS3.
3. jQuery menghubungkan "photorama"
Galeri-slider yang bagus.
4. Efek Teks "Efek Tipografi"
Efek menarik untuk bekerja dengan tipografi dengan CSS3 dan jQuery. 7 efek keren yang berbeda.
5. Plugin "Darkbox"
Plugin cahaya kecil untuk menampilkan gambar di blok pop-up.
6. Efek Hover pada jQuery
Efek melingkar saat melayang.
7. Tombol Animasi JQuery CSS3
Banyak efek CSS3 animasi berbeda untuk membuat tombol yang menakjubkan untuk situs Anda. Efek yang sangat keren saat melayang.
8. HTML5 jquery mengubah gambar latar belakang
Ketika Anda mengklik thumbnail, gambar latar belakang saling menggantikan dengan efek blur. Ketika jendela browser diubah ukurannya, ukuran gambar latar belakang diubah.
8. Efek Tipografi Interaktif
Efek teks yang menarik menggunakan HTML5 dan jQuery (4 efek berbeda). Mouse di atas teks untuk melihat efeknya.
9. tanda tangan gambar pop-up
Banyak efek animasi berbeda saat melampirkan untuk mengimplementasikan tanda tangan gambar pop-up.
10. Plugin "Portamento"
Blok terapung di jquery. Selalu tetap di zona visibilitas saat menggulir halaman ke bawah.
11. Scroller Konten
plugin jQuery untuk menampilkan geser di blok ukuran tetap. Beberapa dekorasi gaya.
12. Plugin "Scrollbars"
implementasi jQuery dari gulir horizontal dan vertikal dari konten dalam unit ukuran tetap.
13. Plugin "Scrollbar Tiny"
plugin jQuery untuk mengimplementasikan gulir konten vertikal dan horizontal.
Demo
Unduh.
14. Plugin "JScrollpane"
Cross Browser menggulir konten di blok.
15. Blok Terapung "Scroll Ikuti"
Plugin untuk membuat blok yang akan menggulir setelah pengguliran halaman. Dimungkinkan untuk memperbaiki blok dengan mengklik tautan.
16. panel pop-up "sidebar"
Menjalankan panel dari semua sisi halaman web.
17. Solusi CSS3 spektakuler untuk halaman plug
Tiga opsi untuk implementasi efek animasi untuk membuat plug "dalam pengembangan".
17. Efek saat menggulir halaman
Efek luar biasa saat menggulir halaman: Elemen-elemen yang berangkat dari area di belakang layar atau sebaliknya bersembunyi di balik area layar. Solusi seperti itu sangat cocok untuk digunakan pada situs portofolio, untuk presentasi yang spektakuler dari proyek-proyek yang telah diselesaikan dengan deskripsi singkat.
19. Plugin "Fancybox 2"
Versi Fancybox baru yang baru ditulis ulang yang disebutkan oleh banyak plugin, untuk menampilkan gambar dan konten lain di modal Windows.
20. Minimit galeri.
Plugin fungsional dengan serangkaian fitur besar: Galeri, Carousel, Slider, Menu, Extender, Tombol Animasi.
21. JQuery News Ticker
Berita rotator di situs. Pesan saling menggantikan dan muncul menggunakan efek menarik dari mesin cetak. Anda dapat berhenti mengubah berita dengan mengklik tombol "Jeda". Arrogmen dapat dipindahkan dari satu pesan ke pesan lain.
22. Gambar adaptif.
Gambar yang dapat diskalakan untuk ditampilkan perangkat seluler. Ukuran gambar tergantung pada ukuran jendela. Teknologi bekas: Javascript dan PHP5.
23. VSCroller.
Vertikal jquery, scroller css3. Kecepatan gulir dan waktu tunda disesuaikan.
24. Menu drop-down multi-level "JQSimpleMenu"
Plugin JQuery Segar untuk membuat menu drop-down horizontal multi-level di situs.
25. "JScarousel 2.0"
plugin jQuery untuk mengimplementasikan carousel vertikal dan horizontal.
26. Rotator "Berita Dinamis"
plugin jQuery untuk tampilan yang cantik dari berita terbaru dari RSS Ribbon.
27. Menu Animasi
Efek animasi saat melayang pada item menu.
28. Efek Teks Animasi
Tiga contoh spektakuler bekerja dengan Properti CSS. "Latar Belakang-Klip: Teks". CSS3 Efeknya tidak berfungsi di browser lama.
29. CSS3 JQuery Blur Effect
Ketika Anda mengarahkan kursor ke blok itu meningkat, dan sisa blok dengan teks kabur di latar belakang.
30. CSS3 Tips Pop-Up JQuery
31. JQuery Pop-Up Hovering Tips
32. Menu CSS Mudah
33 Catatan CSS3 dan HTML5
Implementasi blok mirip dengan Scrapbooks.
34. Rightbox.
Menampilkan sistem media di blok pop-up: gambar, video, flash.
35. jQuery Zumber.
Tingkatkan area persegi.
36. Deskripsi Gambar CSS3 JQuery
Mencolokkan "Galeri Konten Pintu Geser" untuk mengimplementasikan deskripsi gambar pop-up. Ketika Anda mengarahkan kursor ke beberapa gambar yang disajikan muncul deskripsi Singkat Dengan mengacu pada artikel lengkap. Ketika Anda melayang: efek menaikkan pintu garasi.
37. Efek "sebelum dan sesudah" jquery plug "uCompare"
Memikirkan tirai, Anda dapat membandingkan dua gambar yang ditumpangkan satu sama lain. Ideal untuk kasus-kasus tersebut ketika Anda perlu mengatur dua opsi untuk apa pun di halaman: sebelum dan sesudah.
38. Efek Rotasi Gambar
39. Peta interaktif perdamaian dan Eropa dan Amerika Serikat
40. Slide Show "Slider.js v1.1"
Beberapa efek transisi animasi berbeda antara slide.
1. jQuery menghubungkan "melayang zoom"
Solusi asli untuk mengimplementasikan deskripsi gambar saat melayang kursor menggunakan efek zoom.
2. pasang "tawanan"
3. Deskripsi gambar jQuery di galeri
Ketika Anda mengarahkan kursor, deskripsi muncul, dan gambar itu sendiri dituangkan dengan lapisan transparan, warna tertentu.
4. Implementasi JQuery dari tanda tangan gambar
Beberapa perwujudan tanda tangan untuk gambar yang muncul ketika Anda mengarahkan kursor mouse.
5. Efek jQuery dari pintu geser
Ketika Anda melayang dengan miniatur, deskripsi muncul di tempatnya.
6. JQuery Plug "Zoominfo"
Ketika Anda mengarahkan kursor ke gambar, itu berkurang dan nama dan deskripsi foto muncul.
7. JQuery Plug "Mosaic"
Implementasi deskripsi gambar pop-up saat melayang kursor mouse. 8 berbagai jenis tanda tangan pop-up disediakan. Anda dapat melihatnya di halaman demo.
Ketika Anda mengarahkan kursor mouse ke gambar meninggalkan deskripsi singkat dengan mengacu pada informasi terperinci.
9. Plugin untuk menerapkan tanda tangan gambar
Pilihan lain untuk mengimplementasikan tanda tangan gambar pop-up saat melayang kursor. Ada kesempatan untuk memilih dari dua efek JQuery. Penampilan tanda tangan.
10. Deskripsi gambar "jendela pratinjau"
Plugin untuk gambar tanda tangan. Ketika Anda mengarahkan kursor mouse dengan efek animasi, deskripsi muncul. JQuery digunakan untuk membuat animasi.
Disiapkan berdasarkan bahan
plugin jQuery adalah salah satu komponen yang paling penting saat membangun situs, dan memang aplikasi web apa pun. Mereka memungkinkan Anda untuk memperluas fungsionalitas Anda. Artikel ini mencantumkan plugin yang paling berguna pada 2012. Untuk lebih pencarian yang nyaman semua plugin dibagi menjadi beberapa kategori berikut: tata letak halaman web - plugins, label untuk navigasi, formulir formulir, plug-in untuk membuat slider, plug-in untuk grafik dan grafik, efek untuk gambar dan lainnya. Juga di antara plugin ini memiliki plugin yang akan membantu Anda membuat aplikasi adaptif Anda.
Plugin Layout Halaman
equalize.js adalah plugin jQuery yang memungkinkan Anda membuat struktur blok situs. Ini memungkinkan Anda untuk menaikkan ketinggian dan lebar elemen apa pun.
Plugin baru untuk layout adaptif. Freetile memungkinkan Anda membuat elemen dengan ukuran apa pun, sementara kebutuhan untuk membuat ukuran tetap kolom grid menghilang.
Plugin Gridster.js jQuery untuk membangun drag and drop-grid. Juga menggunakannya dapat dihapus secara dinamis dan menambahkan elemen dari grid.
Zoomoo.js. - Ini adalah plugin jquery-plugin yang mudah digunakan untuk meningkatkan elemen halaman web. Anda dapat dengan mudah menambahkan efek zoom hanya dengan menambahkan kelas "zoomtarget" ke elemen HTML apa pun. Peningkatan ini dapat diatur ulang dengan mengklik halaman. Plugin diuji di Internet Explorer. 9, Safari 3 +, Firefox 3.6 +, Opera dan Chrome.
WOOKMark adalah plugin untuk membuat templat multiscount yang dinamis.
jQuery Hiddenposition adalah plugin yang memungkinkan Anda menambahkan item, bahkan jika itu disembunyikan.
Stellar.js - jQuery-plugin, yang menyediakan efek paralaks untuk item.
Plugin jQuery, yang menambahkan efek membalik-balik halaman nyata selama transisi antara bagian. Akselerasi perangkat keras yang digunakan. Bekerja pada tablet dan smartphone.
Plugin untuk tipografi adaptif. Ini memungkinkan Anda untuk menggunakan pemilih yang menghasilkan ukuran font yang sempurna.
Memungkinkan Anda membangun gerakan animasi di situs, termasuk semua transformasi yang mungkin.
Plugin untuk navigasi
Horizontalnav adalah plugin jQuery yang membentang menu horizontal sehingga sesuai dengan seluruh lebar wadah. Jika Anda pernah mencoba menciptakan efek dari ketegangan menu navigasi yang benar Kontainer CSS. Proyek, maka Anda pasti tahu betapa sulitnya lakukan untuk kompatibilitas lintas-browser. Plugin ini melakukannya dengan mudah.
stickyMojo adalah panel samping "lipuchy" yang mudah, cepat dan fleksibel di JQuery. Ini bekerja dengan Firefox, Chrome, Safari dan IE8 + (dapat mendukung IE versi lama).
ddslick adalah plugin yang memungkinkan Anda membuat menu drop-down dengan gambar dan deskripsi.
Plugin untuk organisasi sederhana dari panel drop-down. Plugin mendukung pekerjaan dengan cookie untuk menyimpan status panel. Di antara opsi memiliki fungsi referensi untuk mengkonfigurasi proses pembukaan dan penutupan bagian.
Plugin untuk membuat blok lipat yang mungkin berisi data apa pun di ruang terbatas.
Forming Plugins.
Plugin ini memungkinkan Anda untuk menentukan tingkat kompleksitas kata sandi.
JQuery-Plugin untuk memvisualisasikan proses unduhan file. Ini mendukung drag & drop dan membuat pratinjau instan untuk foto.
Plugin yang menentukan dan memeriksa nomor kartu kredit. Ini memungkinkan Anda untuk menentukan jenis kartu kredit.
Plugin ke Filter Data. Anda dapat memfilter data pada tag dan untuk beberapa tag dan kategori.
Plugin yang memeriksa input surel pada kebenaran daftar yang sudah disiapkan sebelumnya (di sini Anda dapat memasukkan yang paling populer layanan Mail Mail.ru, yandrex.ru, gmail, dll.).
Plugin untuk membuat slider dan carousels
Plugin yang memungkinkan Anda untuk mengontrol transisi menggunakan mouse, touchpad dan keyboard. Untuk transisi yang diatur secara default, Anda dapat menambahkan tambahan, yang juga ada di file sumber.
iosslider.
iosslider adalah plugin untuk slider lintas-browser adaptif.
Rslider - layar penuh slider adaptif. TENTANGh akan secara otomatis beradaptasi dengan lebar layar Anda.
Fresco adalah plugin beku yang adaptif. Ini dapat digunakan untuk membuat program overlay yang menakjubkan yang bekerja dengan sempurna pada ukuran layar apa pun di semua browser, pada semua perangkat.
BookBlock: Plugin Flip Content
BookBlock adalah plugin jQuery yang dapat digunakan untuk membuat komponen dalam bentuk buklet yang akan memungkinkan Anda untuk membuat navigasi seperti "membalik halaman". Di sini Anda dapat menggunakan konten apa pun, baik gambar atau teks. Plugin ini mengubah struktur hanya jika perlu (dengan kata lain, hanya ketika halaman diserahkan) dan menggunakan tumpang tindih dan bayangan untuk memberikan realisme.
Adaptor adalah slider konten yang mudah yang menyediakan antarmuka sederhana kepada pengembang untuk membuat animasi penyelarasan 2D atau 3D yang indah. Saat ini, ada dukungan untuk properti 3D di browser WebKit dan Firefox. Semua transisi 2D diuji di IE6 + dan browser modern lainnya.
Korsel berkelanjutan dengan beberapa fitur yang bermanfaat.Mudah untuk mengkonfigurasi dan mendukung bahkan browser lama.
Rhinoslider. - Cukup fleksibel. jQuery. Slideshow Plugin. Tidak hanya berbagai efek yang ditawarkan, tetapi dimungkinkan untuk menambahkan gaya, efek, dan fungsi mereka sendiri ke slider.
Urutan adalah jQuery-plugin untuk menggulir konten dengan cara asli dan memberi Anda kontrol penuh. Anda dapat menggunakan segala jenis konten; Ini akan menggulir tanpa batas. Markup semantik digunakan di sini, serta template adaptif dan perangkat berdasarkan teknologi sentuh.
Glisse.js adalah galeri JQuery-Photo yang sederhana, adaptif dan mudah disesuaikan.
Plugin untuk grafik dan grafik
Morris.js adalah perpustakaan ringan yang menggunakan jquery dan raphaël untuk memfasilitasi jadwal waktu menggambar.
JQuery Org Chart adalah plugin yang memungkinkan Anda membuat struktur pohon dengan elemen bersarang. Data dimasukkan ke dalam daftar Disordered yang tertanam, yang membuat plugin sangat mudah digunakan.
Plugin untuk tipografi
Bacon.js adalah plugin jQuery yang memungkinkan Anda membungkus teks di sekitar kurva bezier atau baris.
Textualizer - JQuery Plugin untuk membuat efek indah melalui teks. Didukung Pekerjaan di: Chrome, Safari 4+, Firefox 3.5+, yaitu 6,7,8,0, Opera 10.6+, Safari Seluler (iOS 4)
SlabText adalah jQuery-plugin yang sangat berguna yang mencerahkan header sebelum mengubah ukuran setiap baris untuk mengisi area yang tersedia secara horizontal.
trunk8 adalah plugin Teks Trigtele di jQuery. Memungkinkan Anda memotong blok besar teks ke bagian yang lebih kecil untuk inspeksi pendahuluan.
Plugin untuk membuat berbagai efek untuk gambar
Ini adalah plugin jQuery yang menggunakan filter CSS3 untuk membuat efek tilt.
Plugin untuk mengimplementasikan efek gambar adaptif.
plugin jQuery yang memudahkan membuat kartu gambar. Dengan alat ini, gambar peta apa pun dapat disorot atau dipilih, serta kartu dapat dikontrol. cara yang berbeda. Ini bekerja pada semua browser utama, termasuk Internet Explorer 6, itu tidak menggunakan flash, dan tidak memerlukan apa pun kecuali jQuery. Beberapa efek lanjutan memerlukan dukungan HTML5, tetapi masih akan berfungsi di browser lama.
Adaptif, atau jika Anda mau, desain web responsif sekarang bukan hanya tren desainer lain, ini sudah menjadi standar tertentu untuk pengembangan situs, menyediakan universalitas situs web, persepsi visual yang harmonis pada layar berbagai perangkat pengguna. Baru-baru ini, saat berkembang template adaptifSaya harus berurusan dengan berbagai kesulitan dalam integrasi slider dan galeri gambar tertentu, tanpa merusak gaya desain keseluruhan. Sekarang semuanya jauh lebih mudah, ada sejumlah besar solusi siap pakai di jaringan dan apa yang sangat menyenangkan, kebanyakan dari mereka berada di akses gratis, dengan sumber terbuka.
Karena keragaman alat yang diusulkan, saya menyusun ulasan kecil tentang perkembangan slider jquery adaptif yang paling penting yang muncul pada saat terakhir dan didistribusikan tanpa batasan apa pun, I.E. Benar-benar gratis.
Slider WoW.
Slider jquery adaptif dengan set magnificent efek visual (berbelok, keberangkatan, kabur, spiral, tirai, dll ...) dan banyak pola siap pakai. Dengan bantuan Wisaya Penyisipan bawaan Wower, Anda dapat dengan mudah dan mudah membuat tayangan slide yang menakjubkan dalam hitungan menit. Situs web pengembang memiliki semua dokumentasi yang diperlukan pada pengaturan dan penggunaan plug-in dalam contoh-contoh hidup Rusia, sangat baik dari operasi plug-in. Juga tersedia untuk mengunduh terpisah plugin WordPress. Dan modul untuk Joomla. Saya yakin bahwa banyak yang akan menyukai slider yang luar biasa ini, baik pemula maupun panduan webmother.
Hislider.
HTML5, galeri slider jquery dan gambar, plugin benar-benar gratis untuk penggunaan pribadi di situs yang menjalankan sistem populer - WordPress, Joomla, Drupal. Dengan instrumen sederhana, tetapi agak fungsional ini, Anda dapat dengan mudah membuat di halaman situs kami, tayangan slide yang luar biasa dan cerah, presentasi spektakuler dan pengumuman pesan baru. Beberapa pola dan kulit yang sudah jadi untuk slider, efek transisi yang menakjubkan (mengubah), output dari berbagai konten multimedia :, video dengan YouTube dan Vimeo, pengaturan kustom fleksibel, dll ...
Slider nivo.
Nivo Slider adalah jenis lama, terkenal dengan semua orang yang dalam hal ini, salah satu slider gambar yang paling indah dan mudah digunakan. Plugin JQUERY NIVO Slider gratis untuk diunduh dan digunakan lebih lanjut, didistribusikan di bawah lisensi MIT. Ada juga plugin terpisah untuk WordPress, tetapi sayangnya sudah dibayar dan drop off untuk itu akan memiliki $ 29 per lisensi. Lebih baik melakukan sedikit sedikit dengan file tema WP dan kencangkan versi jQuery gratis dari plugin NIVO Slider ke blog Anda, manfaat info bagaimana melakukannya di jaringan cukup.
Adapun fungsional, semuanya dalam urutan yang sempurna. Perpustakaan jQuery v1.7 + digunakan untuk bekerja, efek transisi yang indah, pengaturan sederhana dan sangat fleksibel, tata letak adaptif, pemangkasan gambar otomatis dan banyak lagi.
Gagasan slider terinspirasi oleh pengembang, terkenal dengan seluruh gaya produk Apple, di mana beberapa item kecil (gambar) berubah untuk mengklik pada kategori yang dipilih dengan efek animasi yang sederhana. Codrops menghadirkan pelajaran terperinci untuk membuat slider ini, penyelarasan penuh dari markup HTML, satu set aturan CSS dan plugin jQuery yang dapat dieksekusi, serta contoh hidup yang luar biasa menggunakan slider.
Slider celah.
Slider gambar layar penuh pada buku teks JQuery dan CSS3 + pada integrasi plug-in di halaman situs. Idenya adalah memotong slide terbuka saat ini dengan konten tertentu saat beralih ke konten berikutnya atau sebelumnya. DARI menggunakan jQuery. Dan animasi CSS Anda dapat membuat transisi unik antara slide. Tata letak adaptif dari slider memastikan bahwa ia akan melihat layar yang sama-sama baik di layar. jenis yang berbeda. Perangkat khusus.
Slider konten elastis.
Slider konten yang secara otomatis disesuaikan dengan lebar dan tinggi tergantung pada ukuran wadah induk di mana ia berada. Desain yang cukup sederhana dan slider fleksibel dalam pengaturan jQuery, dengan navigasi di bagian bawah, ketika mengubah ukuran layar hingga reduksi, navigasi ditampilkan sebagai ikon. Dokumentasi yang sangat detail (pembuatan pelajaran) dan contoh penggunaan yang hidup.
Slider stack 3d.
Versi eksperimental dari slider yang menunjukkan gambar dengan transisi dari bidang 3D. Gambar dipecah menjadi dua tumpukan horizontal, menggunakan panah navigasi ditampilkan dan transisi setiap gambar berikutnya ke keadaan tampilan. Secara umum, tidak ada yang istimewa, tetapi ide dan teknik eksekusi cukup menarik.
Sangat sederhana, 100% adaptif dan slider jquery layar penuh. Karya slider didasarkan pada transisi CSS (transisi properti) dalam bundel dengan jQuery Magic. Nilai lebar maksimal 100% diinstal secara default, dengan cara ini ukuran gambar akan diubah tergantung pada ukuran layar. Tidak ada efek animasi khusus dan kesenangan dalam desain, semuanya sederhana, dan dipertajam dengan pekerjaan tanpa gangguan.
Slide minimal
Nama berbicara untuk dirinya sendiri mungkin merupakan salah satu slider jquery yang paling ringan dan minimalis dari gambar yang saya temui (plugin dalam 1kb). ResponsivesLides.js. Plugin -Kornet jQuery, yang membuat slide show menggunakan elemen di dalam wadah. Bekerja dengan berbagai macam browser, termasuk semua versi IE - rem kemajuan terkenal, dari IE6 dan lebih tinggi. Makalah ini menggunakan transisi CSS3 dalam bundel dengan JavaScript, untuk keandalan. Markup sederhana menggunakan daftar yang tidak berurutan, mengatur transisi dan interval waktu, otomatis dan kontrol manual Switching slide, serta dukungan untuk beberapa tayangan slide. Ini adalah "bayi" yang sangat lezat.
Kamera.
Kamera - jQuery gratis. Plugin untuk mengatur tayangan slide di halaman situs, slider cahaya dengan banyak efek transisi, dengan tata letak adaptif 100%, dan sangat pengaturan Sederhana. Sangat cocok pada layar perangkat pengguna apa pun (monitor PC, tablet, smartphone, dan handphone). Kemampuan untuk menunjukkan video built-in. Perubahan slide otomatis dan kontrol manual menggunakan tombol dan blok gambar. Praktis galeri penuh gambar dalam desain kompak.
bxslider jquery.
Lain, slider adaptif yang cukup sederhana pada jQuery. Dalam slide, Anda dapat menempatkan konten, video, gambar, teks, dan elemen lainnya. Dukungan diperpanjang untuk layar sensorik. Gunakan transisi animasi CSS. Sejumlah besar variasi berbeda dalam presentasi slideshow dan galeri gambar kompak. Kontrol otomatis dan manual. Switching slide menggunakan tombol dengan memilih thumbnail. Ukuran kecil dari file sumber sangat sederhana dalam pengaturan dan implementasi.
FlexSlider 2.
FlexSlider 2 - Versi terbaru Slider dengan nama yang sama, dengan tingkat respons yang lebih baik, pelayanan skrip, dan meminimalkan rekomposisi / redrawing. Plugin ini mencakup slider dasar, mengendalikan kontrol slide menggunakan thumbnail, panah built-in dari kanan kiri dan panel navigasi bawah dalam bentuk tombol. Kemampuan untuk menghasilkan dalam slide video (Vimeo), pengaturan parameter yang fleksibel (transisi, desain, interval waktu), tata letak yang sepenuhnya adaptif.
Galleria.
Terkenal dan cukup populer plugin adaptif jQuery untuk membuat galeri dan slider berkualitas tinggi. Antarmuka slider, berkat panel kontrolnya, secara visual menyerupai pemutar video yang biasa, komposisi plugin ini mencakup beberapa dekorasi yang berbeda. Video dan gambar yang disematkan dengan layanan Populer: Flickr, Vimeo, YouTube dan lainnya. Dokumentasi terperinci Dengan mengatur dan menggunakan.
Blueberry.
Sederhana tanpa embel-embel bilah jQuery gratis, ditulis khusus untuk desain web adaptif. Blueberry adalah plugin open source jquery eksperimental. Desain minimalis, tidak ada efek, hanya gambar pop-up dengan lancar saling menggantikan setelah periode waktu tertentu. Semuanya sangat sederhana, dimasukkan, saya terhubung dan maju ...
jQuery Popeye 2.1.
Slider gambar jQuery yang sangat kompak dengan elemen lightbox. Karena ukurannya yang fleksibel, sangat hanya tertanam dalam satu wadah ke dalam satu posting dalam bentuk miniatur, ketika Anda mengarahkan kursor mouse atau mengklik kotak light yang diaktifkan dengan gambar dan elemen kontrol yang diperbesar. Lebih mudah untuk menempatkan slider seperti itu di panel samping, untuk presentasi produk atau pengumuman berita. Solusi luar biasa untuk situs dengan sejumlah besar informasi.
Urutan
Slider adaptif gratis dengan transisi CSS3 yang diperluas. Gaya minimalis, 3 tema dekorasi, setiap slide frame dalam arah horizontal yang muncul di tengah gambar ke kiri, tanda tangan di sebelah kanan, miniatur diduplikasi di sudut kanan bawah. Kerusakan halaman presentasi produk untuk dilihat di setiap frame. Kontrol juga menyertakan tombol bolak-balik. Mendukung semua browser modern.
GESER.
Ada slider promosi yang sepenuhnya promosi dan fungsionalitas dan pada pengaturan, dari pengaturan ada perubahan dalam kecepatan perubahan slide, menghubungkan mode manual (tombol kontrol diaktifkan), pertunjukan slide terus menerus. Slider ini memiliki hak untuk menjadi dan dia hanya menarik saya dengan kenyataan bahwa itu, saya tidak menemukan sesuatu yang sangat menarik dalam perkembangan ini, saya mungkin telah mencari buruk)))
Slider gambar responsif.
Slider adaptif gambar yang indah dari Vladimir Kudinovov. Baik, alat yang sangat dikembangkan, dilengkapi dengan contoh visual dan instruksi terperinci untuk membuat, menginstal dan menggunakan. Desain adaptif, Tombol lucu dan penembak hijau, semuanya cukup lucu dan tenang, tanpa tekanan.
Fraksi.
Plugin slider jQuery gratis dengan efek paralaks untuk gambar dan slide teks. Geser animasi memiliki beberapa nilai acara dengan kontrol penuh pada setiap parameter waktu dan animasi. Kemampuan untuk animasi sekaligus beberapa elemen pada slide. Anda dapat mengatur berbagai metode Animasi, hilangnya slide atau transisi dari arah tertentu. Tampilan otomatis dan kontrol manual menggunakan panah navigasi muncul saat Anda mengarahkan. 10 jenis efek animasi dari penampilan slide dan banyak lagi ...
Ulasan itu cukup luas, tetapi tidak cukup informatif karena sejumlah besar produk yang sedang dipertimbangkan. Semua detail dan deskripsi terperinci. kegunaan Satu plug-in, Anda dapat belajar langsung pada halaman pengembang. Masih berharap seseorang telah meredakan pencarian alat yang paling diperlukan, untuk membuat slider gambar berwarna-warni di halaman situs mereka.
Pernahkah Anda berpikir bahwa akan menyenangkan untuk dapat bekerja dengan templates Russified? Pikirkan saja sebentar. Tidak ada waktu pengeluaran untuk bekerja dengan templat bahasa Inggris. Kami sedang terburu-buru untuk menyenangkan Anda dengan fakta bahwa templateMonster sekarang dapat ditemukan di pemasar templateSter. Teks untuk masing-masing dari mereka ditulis secara manual. Dan, tentu saja, semua solusi jadi sangat mudah digunakan.
Dengan segala hormat, Andrew
Browser secara otomatis membuat tips pop-up ketika webmaster diresepkan ke atribut judul Teks apa pun (sebagai aturan, atribut judul Diterapkan pada tag
dan
. Untuk tautan dan gambar). Ketika pengguna membawa kursor mouse ke tag di mana atribut hadir judulBrowser menampilkan ujung pop-up. Tips pop-up ini ( tooltip.) Kami akan mengedit.
Artikel ini akan mempertimbangkan:
- Cara menggunakan plugin untuk mengganti tips pop-up standar
- Cara mengkonfigurasi Tooltip QTIP
- Cara menampilkan konten AJAX di ujung pop-up
Tips Pop-Up Teks Kustom Sederhana
Saya harap Anda tidak perlu menjelaskan bahwa atribut seperti judul, alt seringkali sangat diperlukan. Lagi pula, mereka membantu pengguna lebih baik menavigasi dalam sejumlah besar informasi dan, apalagi, ini sangat berguna untuk optimasi mesin pencari. Satu-satunya masalah dengan petunjuk - mereka tidak dapat diubah menggunakan gaya CSS. Untuk mengatasi masalah ini, kami menggunakan kesempatan.
1. Buat bingkai file HTML dasar, yang berisi dengan atribut judul.
Daftar Tautan:
- utama.
- Tentang perusahaan
- Kontak
- Portofolio
2. Sekarang perlu mengunduh plugin QTIP dari repositori.
3. Hubungkan file yang diunduh:
// Perpustakaan Standar jQuery. // Dalam file ini kami akan meresepkan skrip jQuery
4. Untuk mengerjakan petunjuk pop-up yang cukup untuk mendaftar di Scripts.js:
$ (DOKUMEN). Sudah (fungsi () ($ ("A"). Qtip ();));
Desain ini berarti bahwa untuk semua referensi yang ada pada atribut judul akan diterapkan menggunakan metode QTIP ().
Menyiapkan JQuery QTIP.
1. Kustomisasi tips pop-up bisa berbeda. Untuk memulainya, ubah posisi yang akan ditampilkan.
$ ("A"). QTIP ((Posisi: (Pusat Bawah "Saya", // Posisi Kursor di: "Top Pusat", // Posisi Pop-Up Posisi: $ (JOWN) // Tips tidak akan Lick the Edges Screen)));
2. Setelah mengatur posisi, Anda dapat mengambil bagan warna yang cepat. Secara default, file jQuery.qtip.min.css berisi gaya warna berikut:
Qtip-default (gaya default kuning)
Qtip-bootstrap.
Untuk beberapa gaya ini, Anda dapat menambahkan bayangan: qtip-shadow. Selain itu, tidak ada yang mengganggu menciptakan gaya mereka sendiri, secara sempurna dikombinasikan dengan umum, meskipun standar lebih dari pelecehan.
$ ("A"). QTIP ((Posisi: (My: "Bottom Center", di: "Top Center", Viewport: $ (Window)), Gaya: (Kelas: "Qtip-Green Qtip-shadow")) ;
Membuat menu navigasi dengan prompt pop-up
1. Untuk memulai, buat bingkai HTML:
#Navigasi (latar belakang: RGB (132.136.206); / * Browser lama * / latar belakang: -Moz-linear-gradien (atas, rgba (132,136,206,1) 0%, RGBA (72,79,181,1) 50%, RGBA (132,136,206 , 1) 100%); / * ff3.6 + * / latar belakang: -webkit-gradien (linier, kiri atas, kiri bawah, berhenti warna (0%, RGBA (132,136,206,1)), Color-Stop (50 %, RGBA (72,79,181,1)), Color-Stop (100%, RGBA (132,136,206,1)))); / * Chrome, Safari4 + * / Latar Belakang: -WebKit-linear-gradien (TOP, RGBA (132.136,206 , 1) 0%, RGBA (72,79,181,1) 50%, RGBA (132,136,206,1) 100%); / * Chrome10 +, Safari5.1 + * / Latar Belakang: -O-linear-gradien (atas, RGBA (132.136.206, 1) 0%, RGBA (72,79,181,1) 50%, RGBA (132,136,206,1) 100%); / * Opera11.10 + * / Background: -ms-linear-gradien (TOP, RGBA ( 132,136.206, 1) 0%, RGBA (72,79,181,1) 50%, RGBA (132,136,206,1) 100%); / * IE10 + * / filter: progid: DximAgetransform.Microsoft.Gradient (StartColorstr \u003d "# 8488CE" , Endcolorstr \u003d "# 8488ce", gradienttype \u003d 0); / * ie6-9 * / latar belakang: linear-gradien (atas, rgba (132,136,206,1) 0%, RGBA (RGBA ( 132,136,206,1) 100%); / * W3C * / Daftar-Style-Type: Tidak ada; MARGIN: 100px 20px 20px 20px; Padding: 0; Overflow: Tersembunyi; -WebKit-Border-Radius: 5px; -MOZ-BORDER-RADIUS: 5px; Border-Radius: 5px; ) #Navigasi li (margin: 0; padding: 0; display: block; float: kiri; border-right: 1px solid # 4449a8;) #Navigasi A (warna: 1px solid # 8488ce; blok; padding: 10px;) #Navigasi A: Arahkan (latar belakang: # 859900; warna kanan-kanan: # A3BB00;)
Akibatnya, gambar berikut harus diperoleh:
3. Dalam Scripts.js File Tambah:
$ ("# Navigasi a"). QTIP ((posisi: (My: "Top Center", di: "Pusat bawah", viewport: $ (jendela)), Tampilkan: (Efek: Fungsi (Ini ) .Slidedown (300);), Sembunyikan: (Efek: Fungsi (Offset) ($ (ini) .slideup (100);), Gaya: (Kelas: "qtip-green qtip-shadow",)))) ;
Sekarang, ketika Anda mengarahkan kursor mouse pada menu navigasi, petunjuk pop-up akan ditampilkan (atribut judul).
Menampilkan konten lain di ujung pop-up
Selain menampilkan tag standar, konten lain dapat ditampilkan dalam petunjuk pop-up, misalnya diambil dari file, dari wadah tersembunyi, atau database, dan tanpa mem-boot ulang halaman menggunakan teknologi AJAX.
Tautan ini mengambil konten dari file dengan Ajax
Nilai atribut href \u003d "tooltip.txt" berarti bahwa hyperlink mengacu pada file txt biasa.
$ (". Infobox"). Masing-masing (fungsi () ($) .qtip ((konten: (teks: "Memuat ...", // Saat konten dimuat, catatan Ajax ini akan ditampilkan: (URL: (URL: (URL: (URL: $ (Ini) .Attr ("href") // Di mana untuk mengambil konten), Judul: (// Tambahkan bidang dengan tajuk dalam teks tooltip: $ (ini) .attr ("title"), tombol: Benar // Menambahkan tombol untuk kiat penutupan)), Posisi: (My: "Top Center", di: "Pusat bawah", Efek: FALSE, // Menghapus efek viewport: $ (jendela)), Tampilkan: (Acara: "Klik ", // Tip Tampilan Ketika Anda mengklik tautan, dapat diganti dengan 'hover', maka prompt muncul ketika Anda melayang solo: true // memungkinkan Anda untuk menampilkan hanya satu tooltip di layar), sembunyikan:" Unfocus ", // klik klik saat mengklik pada elemen halaman gaya lain: (kelas:" qtip-green qtip-shadow ")));)). Bind (" klik ", fungsi (e) (e.preventdefault ())) ; // Ketika Anda mengklik tautan, browser tidak akan mengunduh URL
Penerimaan Ajax ini hanya berfungsi saat server berjalan. Sehingga ia perolehan di komputer lokal harus diinstal, misalnya,.
Sejauh ini, saya belum lupa apa pro dan kontra memiliki radiator bagian aluminium dan radiator mana yang biasanya memilih konsumen.
(Menjatuhkan: 409)
