Galeri Gambar Mikro: Plugin jQuery

Ada versi baru di sini: Di ​​banyak blog dan situs berita gambar sebagian besar dimasukkan sebagai tambahan konten. Ruang sering terbatas dan karena itu kami memikirkan solusi cerdas untuk mengintegrasikan galeri gambar miniatur yang tidak menempati banyak ruang. Plugin jQuery berikut mengubah [...]

Dari sponsor bulanan kami: HelloSign API: Semua yang diinginkan dan disukai pengembang. Coba gratis hari ini.

Lihat demoUnduh sumber

Ada versi baru di sini :

Di banyak blog dan situs berita gambar sebagian besar dimasukkan sebagai tambahan konten. Ruang sering terbatas dan karena itu kami memikirkan solusi cerdas untuk mengintegrasikan galeri gambar miniatur yang tidak menempati banyak ruang.

Plugin jQuery berikut mengubah satu set gambar menjadi galeri kecil dengan beberapa opsi. Micro Image Gallery memungkinkan untuk beralih antara tampilan kisi yang menunjukkan pratinjau gambar sebagai gambar kecil dan tampilan tunggal yang hanya menampilkan satu gambar. Bilah navigasi dapat disembunyikan dan digeser keluar saat melayang di atas galeri, atau terlihat. Total sembilan thumbnail ditampilkan dalam pratinjau kisi. Plugin akan secara otomatis mengubah ukuran gambar sesuai dengan ukuran galeri yang dipilih.

Parameter Plugin

Plugin memiliki konfigurasi berikut:

• menu: Menentukan apakah menu harus terlihat (benar) atau hanya muncul ketika melayang di atas galeri (salah). Nilai standarnya benar.
• ukuran: Ukuran galeri gambar: "kecil", "sedang" atau "besar"
• mode: Mode awal galeri gambar: "tunggal" atau "jempol"

Tiga ukuran galeri gambar menentukan ukuran gambar berikut (tinggi dan lebar maksimal):

• kecil: 102 piksel
• media: 162 piksel
• besar: 222 piksel

Struktur HTML

Semua gambar harus dibungkus dengan div dengan kelas "microGallery":

< div  id = "mG1"  class = "microGallery" > 
    < img  src = "gallery / 2.jpg" /> 
 < img  src = "gallery / 3.jpg" /> 
 < img  src = "gallery / 4.jpg" /> 
 < img  src = "gallery / 5.jpg" /> 
</ div >

dan Anda dapat memanggil plugin:

$ ( "# mG1" ). microrogallery ();

Harap dicatat bahwa di IE tidak ada batas bulat atau bayangan kotak yang akan ditampilkan. 
Ada versi baru di sini : 
Lihat demoUnduh sumber