15 Perpustakaan Lightbox Untuk Responsif Bergerak

Lightbox adalah satu cara yang popular imej overlay di web. Apabila anda mengklik pada imej, Lightbox muncul dengan beberapa bentuk animasi, dan meremehkan latar belakang supaya tumpuan anda pada imej itu sendiri. Imej juga lebih besar secara berskala. Perpustakaan Lightbox Lightbox yang paling popular yang kami kenal selama bertahun-tahun membolehkan anda melakukan ini dengan baik di desktop, tetapi tidak begitu banyak pada platform mudah alih.

Mengabaikan ini, dan keperluan untuk responsif, bukan idea yang baik pada masa kini, itulah sebabnya koleksi 15 perpustakaan Lightbox responsif ini mesti diperiksa.

Lagi mengenai Hongkiat:

• Mewujudkan Tetingkap Modal Mudah Dengan Dialog HTML5
• Galeri Foto / Persembahan Terkini 10 Teratas
• Buat, Kawal & Suaikan Lebih Baik Modal Window Untuk Laman Anda Menggunakan Vex
• jQuery Image Galleries & Sliders - Best Of

PhotoSwipe

PhotoSwipe adalah setakat ini plugin ligthbox kegemaran saya. Ia ringan, sentuhan yang dibolehkan, dan modular yang paling penting yang membolehkan saya menyusup beberapa bahagian yang tidak diperlukan. Ia berfungsi dengan baik dalam penyemak imbas mudah alih. Anda boleh menggeser imej dengan jari anda seperti yang anda lakukan dalam aplikasi asli, dan peralihan berjalan dengan lancar.

• Ketergantungan: Tiada
• Sokongan Penyemak Imbas: IE8 +, Chrome, Firefox, Safari, Opera, dan beberapa pelayar mudah alih.
• Lesen: Lesen MIT

MagnificPopup

MagnificPopup adalah plugin lightbox lain, dibangunkan oleh orang yang sama yang memberi kami PhotoSwipe, Dmitry Semenov. Ia datang dalam bentuk plugin jQuery / Zepto, dan juga membawa keupayaan yang hilang dalam PhotoSwipe seperti sokongan untuk Video, Map, dan kandungan Ajax. Ini adalah alternatif yang hebat untuk mereka yang lebih suka mempunyai lebih banyak ciri di tangan.

• Ketergantungan: jQuery 1.9.1+, atau Zepto.js
• Sokongan Penyemak Imbas: IE7 (sebahagiannya), IE8 +, Chrome, Firefox, Safari, dan Opera.
• Lesen: Lesen MIT

SwipeBox

Swipebox adalah plugin jQuery dengan sokongan isyarat sentuhan untuk platform mudah alih. Ia juga menyokong video dari Youtube dan Vimeo selain imej. Swipebox juga mudah dilaksanakan, dan mempunyai segelintir pilihan untuk menyesuaikan kelakuannya. Saya fikir Swipebox adalah plugin lightbox yang hebat untuk noobs JavaScript.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE9 +, Chrome, Safari, Firefox, Opera, IOS4 +, Android, dan Windows Phone.
• Lesen: Tidak jelas

iLightbox

iLighbox adalah plugin lightbox jQuery dengan sokongan pelbagai jenis media: termasuk video, Flash / SWF, kandungan Ajax, iframe dan peta. Plugin ini juga menambah butang media sosial di atas media, membolehkan pengguna berkongsinya ke Facebook, Twitter atau Reddit. Lihat juga bahagian lanjutan untuk melihat bagaimana iLightbox boleh digunakan dalam senario yang berbeza.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE7 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Tidak jelas

Lightbox untuk Bootstrap

Peti cahaya adalah salah satu bahagian yang hilang dari Bootstrap. Plugin ini membetulkannya. Jika anda menggunakan Bootstrap, saya sangat mengesyorkan menggunakan perpustakaan ini. Plugin ini bersepadu dengan Bootstrap's code-base.

• Ketergantungan: jQuery dan Bootstrap Modal
• Sokongan Penyemak Imbas: IE8 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen GNU

Nivo Lightbox

Nivo Lightbox adalah plugin lightbox fleksibel. Beberapa pilihan dimasukkan untuk menukar rupa ke dalam cara anda menyukainya, seperti menukar tema, kesan peralihan, dan menukar navigasi.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE9 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen MIT

ImageLightbox

ImageLightbox adalah plugin lightbox tanpa kembung. Ia dibina khas untuk imej maka nama yang diberikan - tiada video atau jenis media lain yang disokong. Ia juga tidak memerlukan markup HTML luaran; yang elemen adalah mencukupi. Plugin itu hanya berfungsi.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE9 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Tidak jelas

Mini Lightbox

Satu lagi plugin lightbox dengan tiada padanan. Perpustakaannya hanya 2kb, dan hanya berfungsi dengan imej. Ia adalah plugin sempurna jika anda hanya menetapkan untuk penyemak imbas terkini dan tidak perlu melapisi jenis media lain seperti video.

• Ketergantungan: Tiada
• Sokongan Penyemak Imbas: IE10 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen MIT

LightCase

Lightcase adalah plugin lightbox yang indah. Ia datang dengan beberapa animasi yang membuat interaksi pengguna menjadi hidup, seperti pudar, zoom elastik dan menatal. Tambahan pula, ia juga menyokong pelbagai jenis media termasuk membenamkan Youtube, video HTML, SWF dan borang input. Plugin juga menangani media dengan betul tidak dapat dicapai atau mendapati ralat

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE9 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen GPL

Yalb

Yalb bermaksud Satu lagi Lightbox - tetapi tidak. Yalb datang dengan beberapa API termasuk peristiwa adat yang membolehkan anda mengenal pasti keadaan peti cahaya, seperti ketika ia buka dan apabila ia berlaku tutup. Yalb datang dalam dua versi, JavaScript Vanilla dan plugin jQuery.

• Ketergantungan: Tiada
• Sokongan Penyemak Imbas: IE9 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen MIT

FeatherLight

The 6kb Featherlight adalah plugin kosong untuk pemaju yang bijak dan hanya membawa keperluan. Sekiranya anda memerlukan, sebagai contoh, untuk menyertakan kotak cahaya imej dalam galeri, anda boleh memasukkan sambungan galeri. Anda juga boleh mengembangkan pelanjutan anda sendiri untuk plugin ini agar sesuai dengan keperluan projek anda.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE8 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen MIT

LightLayer

LightLayer adalah plugin ringan yang mudah digunakan. Ia mempunyai beberapa pilihan, kaedah JavaScript tersuai, dan acara adat. plugin berfungsi dengan imej, video, peta, dan kandungan luaran. Apa lagi yang boleh kita tanyakan.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE9 +, Chrome, Firefox, Safari, dan Opera
• Lesen: Lesen MIT

LightGallery

LightGallery, plugin lightbox lain dengan banyak ciri ditambah. Ia datang dengan lebih daripada 20 pilihan untuk menyesuaikan terperinci butiran peti cahaya.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE7 +, Chrome, Firefox, Safari, Opera, iOS, Android, dan Windows Phone
• Lesen: Lesen MIT

FluidBox

Fluidbox adalah plugin lightbox imej yang diilhamkan dari Medium. Ia berfungsi dengan imej di bawah pelbagai keadaan termasuk imej terapung, imej dengan mutlak kedudukan, imej yang mempunyai sempadan dan padding, dan galeri. Semak bagaimana ia dibina. Jika anda memerlukan plugin WordPress, ada satu.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE9 +, Chrome, Firefox, Safari, Opera
• Lesen: Lesen MIT

StripJS

StripJS adalah plugin lightbox unik. Daripada overlaying imej, plugin itu slaid imej dari sisi sebaliknya, sehingga ia tidak akan menyekat seluruh isi. StripJS menyokong kedua-dua imej dan video.

• Ketergantungan: jQuery
• Sokongan Penyemak Imbas: IE7 +, Chrome, Firefox, Safari, Opera, iOS 5+, dan Android 3+
• Lesen: Lesen Creative Commons BY-NC-ND 3.0