Početna » alat » ZooMove jQuery Plugin za zumiranje slika na lebdenju

    ZooMove jQuery Plugin za zumiranje slika na lebdenju

    Ako ste ikada pregledali web-lokaciju e-trgovine, vjerojatno ste vidjeli efekt zumiranja slike. Zadržite fotografiju proizvoda i taj dio slike se povećava za jasniji prikaz.

    ZooMove dodatak je sjajan način ponovite taj učinak na vašoj web-lokaciji. to je pokreće jQuery, tako da možete brzo pokrenuti i bez mnogo koda.

    ZooMove je potpuno besplatan i otvoren izvor, dostupan na GitHubu za sve znatiželjne programere. Može se instalirati putem NPM, Sjenica, Pređa, ili preuzete izravno iz CDNJS.

    Da biste postavili ZooMove sliku, trebat će vam tri određene datoteke u zaglavlju stranice:

    1. jQuery
    2. ZooMove CSS
    3. ZooMove JS

    Obje ZooMove datoteke može se smanjiti ako želite brže učitavanje stranice. Također možete kombinirati CSS datoteku u glavnu stilsku tablicu ako je to lakše.

    Sva prava magija se događa u HTML-u gdje možete postavi HTML5 podaci- * atributi za različite učinke.

    To vam omogućuje da izradite svoj vlastiti prilagođeni efekt zumiranja na temelju četiri različita parametra:

    1. podaci-zoo-ljestvica - definira ukupna veličina zumiranja pri lebdjenju (npr. 2,0 za 200%)
    2. podaci-zoo-potez - definira je li slika pomiče se zajedno s pokazivačem
    3. podaci-zoo-over - definira zumiranu sliku pojavljuju se iznad izvornika
    4. podaci-zoo-pokazivač - definira pokazivačka točka

    Završni peti parametar omogućuje vam da definirate što novi URL slike treba biti (ako je potrebno).

    Možete koristiti ZooMove u svim većim preglednicima, uključujući IE9 +. Ovaj dodatak je široko podržan i nudi jedno doista korisno iskustvo.

    Ako tražite a jednostavna biblioteka s prikazom zumiranja ZooMove je izvrstan izbor. to je dovoljno lagani pokrenuti na bilo kojoj web-lokaciji i to je pokreće jQuery, tako da nećete morati pisati onoliko koda da biste ga mogli koristiti.

    Posjetite glavnu stranicu da biste je vidjeli u akciji i pogledajte dokumentaciju na GitHubu da biste saznali više.