Bagaimana untuk Buka Thumbnail Seperti Imej Google
Imej Google menjalankan UI unik dengan preview imej kecil dari banyak laman web yang berbeza. Mengklik sebarang imej kecil ini memperluaskan skrin dengan lebih banyak butiran dan gambar yang lebih besar.
Ini salah satu daripada ciri galeri imej terbaik yang saya gunakan dan kini, anda boleh mengklonkannya dengan Gridder.js.
Plugin jQuery percuma ini mengikuti jejak langkah UX yang luar biasa Google dengan membuat plugin yang sepadan dengan kesan ini. Awak boleh giliran mana-mana galeri foto ke galeri gaya Google Imej dengan semua animasi dan ciri paparan yang sama.
Saya terkejut dengan kelajuan dan kemudahan penggunaan yang datang dengan plugin ini. Hanya klik mana-mana lakaran kecil segera memaparkan pukulan yang lebih besar dan animasi sangat bersih.
Imej-imej termasuk bahagian untuk teks deskriptif sekiranya anda ingin menambah beberapa butiran atau pautan yang berkaitan dengan gambar-gambar. Ini berfungsi dengan baik untuk laman web mudah ringkas dengan matlamat memfokuskan pada imej.
Selain itu, anda boleh juga tarik kandungan melalui Ajax. Ini membolehkan anda membuat imej kecil dinamik yang menarik kandungan dari laman web lain atau melalui API.
Setiap peristiwa klik menawarkan kaedah panggil balik, jadi anda juga boleh menjalankan plugin lain atau fungsi JavaScript bersama Gridder. Dengan begitu banyak pilihan, ia praktikal merasakan kerangka keseluruhan grid!
Sejak Gridder berjalan di jQuery, ia memerlukan versi terbaru sebagai pergantungan. Tetapi, itu sahaja yang anda perlukan (bersama-sama dengan fail Gridder.js), dan dengan beberapa baris HTML, anda boleh mempunyai grid anda berjalan lancar.
Anda perlu menyemak halaman GitHub untuk arahan persediaan penuh tetapi ini a pratonton cepat daripada apa yang kelihatan seperti HTML:
Semua kandungan mendapat ditarik melalui JavaScript, jadi anda boleh memuatkan apa sahaja yang anda mahu.
Ia adalah plugin yang sangat serba boleh dengan pilihan untuk ubah kelajuan animasi, pelonggaran, gaya butang tutup, dan tatal posisi mengimbangi untuk apabila pengguna mengklik imej kecil baru.
Pemula dan pemaju pro sama akan mendapati banyak nilai dalam plugin ini. Namun, jika anda masih tidak pasti apakah ini untuk anda melihat halaman demo Gridder secara langsung dan bermain-main.
