Ustvarite hitre postavitve mrežnih zidakov z Bricks.js

Vedno je bilo preprosto ustvarite mrežo z jQuery, z uporabo vtičnikov in brezplačnih vadnic razvijalcev.

Vendar pa so zidarske mreže težje graditi, saj so ne ujemajte enakomerno po strani. Za stolpce boste imeli širino fiksne velikosti, vendar višine izdelkov se lahko zelo razlikujejo.

Če želite narediti pixel-popolna zidarska mreža potrebujete vtičnik, kot je Bricks.js.

Ta vtičnik je popolnoma odprtokoden in smešno hiter. To bo naredite mrežo za manj kot pol sekunde, celo s številnimi elementi na strani.

Večina ljudi prepoznamo zidne mreže iz Pinterest-a, ker so popularizirali postavitev. Ampak, od takrat je postalo uporablja na mnogih drugih spletnih mestih, tudi.

Če želite začeti z Bricks.js, potrebujete vsebine in a privzeta postavitev strani. Dodatek namestite desno od npm ali prek GitHub, če je to lažje.

Z začetno nastavitvijo boste prešli tri posebne parametre:

1. Posoda - a Element zabojnika DOM za omrežje
2. Pakirano - a atribut ki določa, kako se predmeti pretakajo v omrežje
3. Velikosti - a niz širin in žlebov, definirano v slikovnih pikah

Vtičnik uporablja vse te vrednosti za avtomatizacijo zidane mreže iz nič.

In lahko celo uporabite ga za neskončno nalaganje če želite zidane mreže, ki delujejo kot Pinterest.

Oglejte si predstavitveno stran za interaktivna mreža ki jih lahko spremenite za testiranje. Ti določite skupno število elementov in avtomatizira postopek, medtem ko prikazuje celoten čas upodabljanja.

Na primer, testiral sem mrežo z 500 elementov in to je trajalo 13 milisekund dokončati. To ne vpliva na čas, ko se naloži vseh 500 slik, ampak 13 ms za samodejno generirano omrežje je zelo impresivno.

Začnite sami, tako da prenesete datoteke iz GitHub in sledite navodilom za namestitev. To se lahko na začetku počuti zmedeno, bolj ko se z njim igrate, lažje ga je postaviti.