iziModal.js - En virkelig dynamisk Modal Window jQuery-plugin

De fleste modale vinduer synes at være distrahere og irritere den besøgende med opt-in felter og uønskede tilbud. Disse modeller tager ofte over hele siden, ser forfærdelige ud, og giver ikke en klar måde at lukke vinduet på. Heldigvis, iziModal.js er det modsatte.

Det er et af de skønneste modalvinduet plugins jeg nogensinde har set, og det får mig til at interagere med modeller igen.

iziModal.js er en jQuery-plugin så du har brug for det en kopi af jQuery-biblioteket for at dette skal fungere. Men det er ret let og du kan endda Inkluder biblioteket eksternt fra CDNJS.

Bemærk, at dette plugin følger med en masse af forskellige muligheder. Du kan videresende i muligheder til stil den modal størrelse, rammetype og animation. Men det kan du også oprette tilbagekaldsfunktioner hvis brugeren lukker et modal eller klik på et bestemt element.

Du kan finde masser af eksempler på CodePen men jeg kan virkelig godt lide demoer hosted på iziModals hjemmeside. Se nærmere på iframe integrere indstilling hvor den har en autoplay Vimeo-afspiller køet op i modal.

Designet er storslået og modal føles virkelig som det er del af grænsefladen. Kvaliteten af ​​animationen er også imponerende, og den er alle udstyret med CSS3 & jQuery.

På den vigtigste plugin side finder du også dokumentationstabeller med kodestykker for hver af de tilgængelige demoer. Her er den korteste kode at bruge til en modal vindue popup.

 $ (dokument) .on ('klik', '.trigger', funktion (begivenhed) event.preventDefault (); $ ('# modal'). iziModal ('open');); 

Det iziModal () funktion har over 45 forskellige muligheder der kan overføres til Tilpas det modale vindue. Det har også brugerdefinerede begivenheder der kan udløsningsfunktioner som når en modal åbner, lukker eller går fuld skærm.

Dette er et utroligt massivt projekt, og det er nemt et af mine foretrukne modale vindues plugins fra en design og brugervenlighed.

At tage en kopi af kilden, kan du enten Træk det gennem npm eller hent fra GitHub. Og hvis du har forslag til pluginet eller bare vil dele din tak, kan du tweet skaberen Marcelo Dolce @marcelodolce.