10 nejvíce fascinujících jQuery mřížek

jQuery je obvykle první volbou pro většinu lidí, kteří chtějí ponořit nohy do programování JavaScriptu, protože poskytují snadný způsob výběru prvků HTML a manipulace s DOM. jQuery je divoce populární, podle nedávných statistik W3Techs, “jQuery používá 95,4% všech webových stránek, jejichž knihovnu JavaScript známe.”

jQuery je také používán mnoha knihovnami JavaScript jako závislost a alfa verze nového hlavního vydání, jQuery 3.0, je již tam. Pokud váš projekt nějakým způsobem používá jQuery a chcete dynamické, flexibilní uspořádání pro váš návrh stojí za to zvážit zahrnutí pluginu mQuery grid do vašeho frontend stacku.

Jak funguje jQuery Grids?

jQuery mřížky vám umožní Vytvoření rozvržení podobného Pinterestu pro vaše stránky. Pracují jako virtuální matice, následují “krabice uvnitř krabice” zásada. mQuery mřížky dynamicky vypočítávají, co je nejlepší uspořádání položek, a vyplňují stránku s nimi způsobem, který ponechává nejméně prázdného místa, něco, co vidíte v těchto polích zde.

Hlavní výhodou sítí jQuery ve srovnání s mřížkami CSS je, že pracují s obrazy nebo jinými prvky médií, které mají různé šířky a výšky. Cool JavaScript efekty jsou také velkým důvodem, proč použít mQuery pro vytvoření moderního rozložení.

V tomto příspěvku si můžete přečíst o 10 nejvíce fascinujících mřížek jQuery které jsou v současné době na trhu - samozřejmě, stejně jako jQuery, všechny jsou open-source a zdarma.

1. jQuery Nested

jQuery Nested vám poskytne šikovný rozložení více sloupců, které reaguje a funguje napříč všemi druhy zařízení. Tento plugin jQuery se inzeruje jako zcela bez mezer. Zpočátku může tento slogan znít jako levný marketingový trik, ale plugin ve skutečnosti dokonale splňuje mezeru ve svobodě, stejně jako její tvůrci slíbili.

jQuery Nested následuje jedinečný skript naplnění matice mřížky. Nejprve vytvoří mřížku s více sloupci, poté prohledá matici pro mezery a vyplní je přeskupením různých prvků. Konečně - a to je krok, který činí tuto mřížku bez mezer - mění velikost jakéhokoliv prvku ve spodním řádku, který se správně nevejde do mezery.

2. Freewall

Freewall umožňuje vytvořit rozvržení, které chcete, ať je to obrazová mřížka, vnořená mřížka, zdivo nebo mřížka ve stylu metra. Má mnoho možností, které můžete nastavit jako proměnné JavaScriptu gutterX, gutterY, animate, cellW, cellH, atd. Má vlastní události jako onGapFound a onResize, a vlastní metody.

Můžete najít pěkné příklady kódu na svých webových stránkách. Devs se také staral o chudé duše, které ještě musí navrhovat starší prohlížeče, takže Freewall podporuje Internet Explorer 8, a také má řešení pro postižené JavaScript, používá CSS 3 animace jako JS pádová strategie. Podívejte se na náš článek o Freewall zde.

3. Zdivo

Jméno starého dobrého zednáře musí znát uši každého zkušeného návrháře. V případě, že jste o tom neslyšeli, je zednářství kaskádové mřížky rozložení knihovny , který pracuje s jak jQuery a vanilla JavaScript.

Tento praktický plugin je základem mnoha populárních WordPress témat. Nemusíte ani nahrát na server, protože můžete snadno propojit knihovnu přímo z CDN.

>