iziModal.js - En jury Plugin med riktigt dynamisk modal fönster

De flesta modala fönster verkar distrahera och irritera besökaren med opt-in fält och oönskade erbjudanden. Dessa modeller tar ofta över hela sidan, ser hemskt ut, och erbjuder inte ett tydligt sätt att stänga fönstret. Tack och lov, iziModal.js är exakt motsatsen.

Det är ett av de snyggaste modala fönstret plugins jag någonsin har sett och det blir mig upphetsad att interagera med modals igen.

iziModal.js är en jQuery-plugin så du behöver en kopia av jQuery-biblioteket för att detta ska fungera. Men det är ganska lätt och du kan även inkludera biblioteket externt från CDNJS.

Observera att det här pluginet kommer med mycket av olika alternativ. Du kan gå i alternativ till utforma modalstorlek, ramtyp och animering. Men du kan också skapa återuppringningsfunktioner om användaren stänger en modal eller klick på ett visst element.

Du kan hitta gott om exempel på CodePen men jag gillar verkligen demos värd på iziModals hemsida. Specifikt kolla in iframe-inbäddningsalternativet där den har en autoplay Vimeo-spelare kön upp i modal.

Designen är magnifik och modal känns verkligen som den är del av gränssnittet. Kvaliteten på animationen är också imponerande, och den är alla drivna med CSS3 & jQuery.

På den viktigaste plugin-sidan hittar du också dokumentationstabeller med kodfragment för varje tillgänglig demo. här är den kortaste delen av koden att använda för en modal fönster popup.

 $ (dokument) .on ('klick', '.trigger', funktion (händelse) event.preventDefault (); $ ('# modal'). iziModal ('open');); 

De iziModal () funktionen har över 45 olika alternativ som kan överföras till anpassa det modala fönstret. Det har också anpassade händelser som kan utlösningsfunktioner som när en modal öppnas, stängs eller går i fullskärm.

Detta är ett otroligt massivt projekt och det är enkelt ett av mina favoritmodellfönsterpluggar från en design och användbarhet ståndpunkt.

För att ta tag i en kopia av källan kan du heller dra det genom npm eller ladda ner från GitHub. Och om du har förslag om pluginet eller bara vill dela med dig tack kan du tweeta skaparen Marcelo Dolce @marcelodolce.