推薦25個超炫的jQuery網格插件

2019-11-20 13:51:16

字體：大中小

來源：轉載

供稿：網友

　　jQuery 網格插件可以讓你創建各種各樣的表格布局，網格布局是報紙和雜志中最常見的布局，現在的網站中也很常見，在這篇文章中，我向大家推薦25個jQuery的網格插件，你可以任意控制網格的行和列，用文本和圖片進行填充。我用了頂級的來形容這個些插件，我可以肯定你了解它們之后會覺得很酷。

　1. Gridify

　　Gridify是輕量級的 jQuery 插件，用來創建一個類似 Pinterest 圖片加載網格插件。支持圖像加載事件，支持窗口縮放事件，支持非常長的高度項，支持動態項寬度，支持動畫 (CSS3 transition)。

　2. Freewall

　　Freewall是一個跨瀏覽器和響應式的jQuery插件，以幫助您創建多種類型的網格布局：靈活布局，圖像布局，嵌套網格，流體網格，Metro風格布局，類似于pinterest的布局...。此外還擁有漂亮的CSS3動畫效果和回調事件。 Freewall是所有功能于一身的解決方案。可以為桌面，移動和平板創建動態的網格布局。

　3. Responsive Equal Height Blocks

　　Responsive Equal Height Blocks是用JavaScript和CSS實現的。它實際上是把一上列表按每一行來展示，通過每一行中最高的條目來設置和其它條目的位置。

　4. MatchHeight.js

　　MatchHeight.js能使所有選定元素的高度正好相等。這是一個更強大的相同高度的插件，正確處理混合填充，邊距，邊框，框的大小，行，組。它通過在需要的時候自動更新圖像處理和響應式布局。

　5. Gridmanager.js

　　Gridmanager允許你在表格布局中創建、記錄、更新、刪除行和列，創建可編輯區域的網格布局，每一個網格可編輯定義大小和數量以及調整它的位置。GridManager需要jQuery、jQueryUI和Bootstrap 3.x，可選TinyMCE CKeditor。

　6. S Gallery

　　S Gallery是一個jQuery圖片集的插件，它在響應式的表格中展示這你的圖片。它的靈感來自于Sony的產品，當一個條目被選中，界面中會出現選擇前一個/后一個的按鈕，你也可以通過點擊其它位置回到整體的表格布局中。

　7. Elastic Columns

　　Elastic Columns是一個輕量級響應式網格布局插件，可以非常容易的按照寬度值來定義網格，監測瀏覽器的大小自適應網格顯示。

　8. Mason.js

　　Mason.js是一個jQuery插件，巧妙地填充了網格的間隙。當創建一個網格時候，插件就開始計算這些間隙，然后就使用預定義的元素或是在網格中復制的內容來填充這些間隙。可以定義用于元素的大小，列/行的大小，斷點的大小，或者布局是流動還是固定的。

　9. rowGrid.js

　　RowGrid.js 是個非常小的，輕量級的 jQuery 插件，可以對圖像進行直排，而且是響應式的，可以無限滾動閱覽。

　10. BttrLazyLoading

　　BttrLazyLoading是一款響應式圖像延遲加載的 jQuery 插件，允許用戶的 web 應用延遲圖片的加載直到圖像滾動。BttrLazyLoading 提供四種不同的屏幕大小版本：手機 (<768px), 平板 (≥768px), 桌面 (≥992px) 和大型的桌面 (≥1200px)。

　11. jqGrid