Homepage » Toolkit » Hogyan lehet nagyítani a képeket, mint például a közepes

    Hogyan lehet nagyítani a képeket, mint például a közepes

    A Medium blogolási platform a egyéni kép nagyítási hatás a blogoldalain. Amikor a felhasználó rákattint egy képre, automatikusan nagyobb méretre nagyít.

    Ez nagyszerű hatás, és minden bizonnyal egyedülálló a Medium számára, de soha nem volt könnyen másolható.

    Most, a MediumLightbox könnyebb, mint valaha. Ez a JS-parancsfájl könnyű és könnyen hozzáadható bármely webhelyhez vagy bloghoz.

    Ha szeretné látni, hogy ez hogyan működik, látogasson el a élő demo oldal Davide Calignano alkotója.

    Egy darabig töltött egy precíz átmenetet és egyéni animációs hatást hozzon létre egy tükörképet a közepes kép nagyításáról. Az egész könyvtár írt tiszta JavaScript-ben, így nem támaszkodik semmilyen 3-rard fél szkriptek, mint például a jQuery.

    Tudnod kell egy kis JS-t, hogy felállítsd, de biztosan nem kell szakértőnek lenned.

    Minden kép készíthető adat * attribútumok a teljes méretű magasság és szélesség beállításához dinamikusan húzta a Lightbox bővítményből. A telepítési kód nagyon egyszerű és képes célozza meg a képeket, vagy konténerek, mint a

    elem.

    Íme az egyetlen kódrészlet, amelyre a bővítmény futásához szükséges:

     MediumLightbox ( 'figure.zoom-hatástól'); 

    A funkció belsejében adja át a választót minden elemre (pl.

    ) a ... val .zoom-hatás osztály. Ez az osztály meghatározott a MediumLightbox stíluslapjában, így a legjobb, ha ezt az oldalt is használja.

    És ha ez már be van állítva, mindannyian be van állítva!

    Az oldal tartalmának területén az összes képet a

    címke használatával. Automatikusan megkapják ezt a szeretett Közepes kattintási-nagyítási hatást mind az asztali, mind a mobil felhasználók számára.

    A szkript egy példányának letöltéséhez és elkezdéséhez látogasson el a GitHub fő repójára. Itt is megtalálod dokumentáció a kódrészletekkel együtt gyorsan másolhat.