iziModal.js - tikrai dinamiškas modulinis langas jQuery plugin
Dauguma modalinių langų atrodo atitraukia ir erzina lankytoją su pasirinkimo laukai ir nepageidaujamų sandorių. Šie modalai dažnai perima visą puslapį, atrodo baisūs ir nepateikia aiškaus būdo uždaryti langą. dėkingai, iziModal.js yra visiškai priešingas.
Tai vienas iš gražiausių modalinio lango įskiepių, kuriuos aš kada nors matiau, ir jis mane sujaudina dar kartą bendrauti su modalais.
iziModal.js yra a jQuery įskiepis taigi jums reikia jQuery bibliotekos kopija kad tai veiktų. Bet tai gana lengvas ir jūs netgi galite įtraukti biblioteką iš išorės iš CDNJS.
Atminkite, kad šis įskiepis yra daug įvairių variantų. Galite perduoti parinktis stiliaus modalinio dydžio, rėmo tipo ir animacijos. Bet jūs taip pat galite sukurti atgalinio ryšio funkcijas jei vartotojas uždaro modalą arba spustelėja tam tikrą elementą.
Tu gali rasti daug pavyzdžių apie CodePen, bet man tikrai patinka demo, kuris yra iziModal pagrindiniame puslapyje. Konkrečiai, patikrinkite iframe įdėta parinktis kur jis yra Autoplay Vimeo grotuvas eilėje.
Dizainas yra puikus ir modalas tikrai jaučiasi dalis sąsajos. Animacijos kokybė taip pat yra įspūdinga ir visa tai maitinama CSS3 ir jQuery.
Pagrindiniame papildinio puslapyje taip pat rasite dokumentacijos lentelės su kodo fragmentais už kiekvieną turimą demonstraciją. Štai trumpiausias kodas naudoti modaliniam langui.
$ (dokumentas) .on („spustelėkite“, „.trigger“, funkcija (įvykis) event.preventDefault (); $ („# modal“). iziModal („open“););
The iziModal ()
funkcija daugiau nei 45 skirtingų variantų kuri gali būti perduota pritaikyti modalinį langą. Ji taip pat turi individualūs įvykiai tai gali funkcijos pavyzdžiui, kai modalas atsidaro, užsidaro arba eina visą ekraną.
Tai yra neįtikėtinai didžiulis projektas ir jis yra vienas iš mano mėgstamiausių modalinio lango priedų iš a dizaino ir tinkamumo naudoti požiūriu.
Jei norite patraukti šaltinio kopiją, galite ištraukite jį per npm arba atsisiųsti iš „GitHub“. Ir jei turite pasiūlymų dėl papildinio arba tiesiog norite pasidalinti savo padėkomis, galite susikurti kūrėją Marcelo Dolce @marcelodolce.