Odgovarajuće slike postale su jednostavne uz ResponsifyJS

Suvremeni web trebao bi biti 100% odgovarajući, a novije knjižnice sve to čine mogućim.

S besplatnim dodatcima, kao što je ResponsifyJS, još je lakše izraditi web-lokacije na svim uređajima. Ovaj besplatni jQuery dodatak uzima spremnik slika i dinamički ih raspoređuje na temelju različitih veličina zaslona.

Od različitih spremnika držite slike drugačije, mogu se mijenjati na vrlo čudne načine. Ponekad ćete imati fotografije ljudi i njihova lica mogu se odrezati kada se promijene veličina na mobilnom uređaju.

Dodatak za odgovor je stvoren da riješi taj problem. Može raditi automatski, ali prava čarolija leži u njoj određivanje vlastitog područja fokusa na slici.

Koristi se unutarnji sustav decimalnih opisa da biste pronašli gdje bi trebao biti fokus slike. Na primjer, možete definirati pozicije kao što su Podaci fokus-top koji “blokova u” određeni segment slike.

Te podatke je potrebno proslijediti u obliku decimala, na primjer, .5 decimalni broj cilja 50% slike (lijevo / desno ili gore / dolje). To je, naravno, prilično zbunjujuće. Ali, postoji besplatna aplikacija Responsify koji vam omogućuje dinamički izračunajte položaje u pregledniku.

Samo prenesite sliku, definirajte područje fokusa, a zatim kopirajte / zalijepite kôd slike na svoju web-lokaciju. Plugin Responsify imat će sve podatke potrebne za ispravnu promjenu veličine slike na manjim zaslonima.

Možete ih pronaći žive demo veze u repoziciji GitHub, uključujući isječke koda za kopiranje / lijepljenje na web-lokaciju.

Ovaj dodatak nije savršeno rješenje za svaki projekt. Ponekad ćete željeti slike za promjenu veličine bez fiksnih područja fokusiranja. Ali, ako koristite zidne rešetke s jQuery ne šteti dodati ResponsifyJS na svoj stack.

Da biste saznali više, posjetite početnu stranicu dodatka za prikaz uživo, vezu za preuzimanje i potpuni vodič za postavljanje.