A ResponsifyJS segítségével az érzékeny képek könnyen elkészíthetők

A modern webnek 100% -ban érzékenynek kell lennie, és az újabb könyvtárak ezt egyre inkább lehetővé teszik.

Ingyenes bővítményekkel, például: ResponsifyJS, még könnyebb a webhelyeinket minden eszközön használni. Ez ingyenes jQuery plugin a képeket tárolja és dinamikusan átrendezi őket változó képernyőméreteken alapul.

Mivel különböző konténerek tartsa a képeket másképp, nagyon furcsa módon átméretezhetik őket. Néha képeket készít az emberekről, és az arcuk levágásra kerül, ha átméretezi a mobilját.

Ennek a problémának a megoldása érdekében létrehozták a Válaszoló plugint. Automatikusan működik, de az igazi varázslat benne rejlik saját fókuszterületének meghatározása a képen.

Használ egy a decimális leírások belső rendszere hogy hol találja meg a kép fókuszát. Például lehet pozíciók meghatározása mint például data-fókusz-top melyik “blokkok be” a kép bizonyos szegmense.

Ezeket az adatokat át kell adni tizedesjegyek formájában, például egy 0,5 tizedes célpont a kép 50% -a (bal / jobb vagy felső / alsó). Természetesen ez eléggé zavaró, ha magad csinál. De van egy ingyenes Responsify alkalmazás ez lehetővé teszi dinamikusan kiszámítja a pozíciókat böngészőjében.

Csak töltsön fel egy képet, határozza meg a fókuszterületet, majd másolja / illessze be a képkódot a webhelyére. A Responsify plugin minden olyan adatot tartalmaz, amellyel a kép kisebb méretű képernyőkön átméretezhető.

Meglehetősen kevés élő demo linkek a GitHub repóban, beleértve a kódrészleteket a webhelyére másolás / beillesztés céljából.

Ez a bővítmény nem minden megoldás számára tökéletes megoldás. Néha akar a képek átméretezése fix fókuszterületek nélkül. De ha használod falazó rácsok jQuery-vel nem árt hozzáadni a ResponsifyJS-et a veremhez.

Ha többet szeretne megtudni, látogasson el az élő demó, a letöltési hivatkozás és a teljes telepítési útmutató plugin kezdőlapjára.