Laman » Toolkit » The 10 jQuery Grids Paling Menarik

    The 10 jQuery Grids Paling Menarik

    jQuery biasanya merupakan pilihan pertama bagi kebanyakan orang yang ingin mencelup kaki mereka dalam pengaturcaraan JavaScript kerana ia menyediakan kaedah mudah untuk memilih elemen HTML dan memanipulasi DOM. jQuery sangat popular, menurut statistik terkini W3Techs, “jQuery digunakan oleh 95.4% dari semua laman web yang perpustakaan perpustakaannya yang kita kenal.”

    jQuery juga digunakan oleh banyak perpustakaan JavaScript sebagai kebergantungan, dan versi alpha daripada pelepasan utama baru, jQuery 3.0 sudah di luar sana. Jika projek anda menggunakan jQuery dengan apa-apa cara dan anda mahu susun atur yang dinamik, fleksibel untuk reka bentuk anda, patut ditimbang untuk memasukkan plugin grid jQuery ke dalam susunan frontend anda.

    Bagaimana Grid jQuery berfungsi?

    jQuery grids membolehkan anda buat susun atur seperti Pinterest untuk tapak anda. Mereka berfungsi seperti matriks maya, mereka mengikutinya “kotak di dalam kotak” prinsip. Grid jQuery secara dinamik mengira apakah susunan item yang terbaik dan mengisi halaman dengan mereka dengan cara yang meninggalkan ruang kosong-kurangnya, seperti apa yang anda lihat dalam kotak ini di sini.

    IMAGE: DHomie Home Design Magazine

    Kelebihan utama grid jQuery berbanding grid CSS ialah mereka bekerja dengan imej atau unsur media lain yang mempunyai lebar dan ketinggian yang berbeza. Kesan JavaScript yang sejuk juga merupakan sebab utama untuk menggunakan grid jQuery untuk membuat susun atur moden.

    Dalam catatan ini, anda boleh membaca tentang 10 grid jQuery yang paling menarik yang kini berada di pasaran - sudah tentu, seperti jQuery, semuanya adalah sumber terbuka dan bebas.

    1. jQuery Nested

    jQuery Nested menyediakan anda dengan mudah susun atur grid berbilang lajur yang responsif dan berfungsi di semua jenis peranti. Plugin jQuery ini mengiklankan dirinya sebagai bebas sepenuhnya. Pada mulanya slogan ini mungkin terdengar seperti trik pemasaran yang murah tetapi plugin sebenarnya memenuhi kebebasan jurang dengan sangat baik, seperti yang dijanjikan oleh penciptanya.

    jQuery Nested berikut skrip unik dalam mengisi matriks grid. Mula-mula ia mewujudkan grid pelbagai lajur, kemudian mengimbas matriks untuk jurang dan mengisi mereka dengan menyusun semula unsur-unsur yang berbeza. Akhirnya - dan itu adalah langkah yang membuat grid ini tidak baik - ia mengubah saiz mana-mana unsur di baris bawah yang tidak sesuai dengan jurang.

    2. Freewall

    Freewall membolehkan anda membuat susun atur yang anda mahu sama ada ia adalah grid imej, grid bersarang, batu atau grid gaya metro. Ia mempunyai banyak pilihan yang boleh anda tetapkan sebagai pemboleh ubah JavaScript seperti gutterX, gutterY, animate, cellW, cellH, dll. Ia mempunyai acara adat seperti onGapFound dan onResize, dan kaedah tersuai juga.

    Anda boleh mencari contoh kod yang bagus di laman web mereka. Devs juga mengambil berat tentang jiwa miskin yang masih perlu mereka bentuk untuk pelayar lama, jadi Freewall menyokong Internet Explorer 8, dan ia juga mempunyai penyelesaian untuk JavaScript dilumpuhkan, seperti yang digunakan CSS 3 animasi sebagai strategi pemulihan JS. Lihat artikel kami di Freewall di sini.

    3. Masonry

    Nama Masonry lama yang baik mestilah biasa kepada telinga setiap pereka berpengalaman. Sekiranya anda tidak mendengarnya, Masonry adalah perpustakaan susun atur grid yang tersusun yang berfungsi dengan JavaScript jQuery dan vanila.

    Plugin berguna ini adalah asas banyak tema WordPress popular. Anda tidak perlu memuat naiknya ke pelayan anda kerana anda boleh menghubungkan perpustakaan dengan mudah dari CDN dengan mudah.

    >