Buna ziua tuturor! Se întâmplă adesea că pe anumite site-uri este necesar să se arate vizitatorului, la prima vizită, informații în formă de fereastră pop-up (acțiuni, notificări, felicitări). De asemenea, poate fi necesar, de exemplu, pentru site-urile anumitor subiecți să determine vârsta vizitatorului. O altă opțiune este utilizarea acestei funcționalități - pentru a afla succint despre scopul site-ului. Pentru a crea o fereastră pop-up pe jQuery numai când vizitați pentru prima dată site-ul, vom folosi jQuery și mai multe plug-in-uri.
Pentru a afișa o fereastră pop-up, utilizați pluginul arcticModal. Acest plugin, spre deosebire de multe altele, face foarte ușor schimbarea aspectului ferestrelor modale, adesea dificil de făcut, mai ales dacă cea mai mare parte a codului este generată de bibliotecă.
Pentru a afișa fereastra o singură dată, vom stoca în informațiile cookie-urilor că vizitatorul a vizitat site-ul. Lucrul cu cookie-urile ne va oferi un plug-in standard cookie.
Conectați fișierele
Utilizăm Yandex CDN, îl conectăm în cazul în care JQuery nu a fost utilizat. Inserați acest cod în interiorul etichetei
:Descărcați pluginul arcticModal de pe site-ul oficial și conectați-l:
Pentru a decora fereastra, conectăm unul dintre temele standard arcticModal. Cum arată ferestrele, puteți vedea pe site-ul pluginului.
Dacă nu vă place acest design, atunci puteți rezolva cu ușurință, chiar și cu puțină cunoaștere a CSS.
Vă conectăm pluginul cookie:
Tot ce era necesar este conectat, acum vom scrie codul ferestrei pop-up cu informațiile pentru utilizator:
Codul utilizează clasa arcticămodală-închidere. Când faceți clic pe un element cu această clasă, fereastra se va închide.
closeOnOverlayClick - parametrul specifică dacă fereastra va fi închisă când faceți clic pe o zonă din afara ferestrei;
closeOnEsc - parametrul specifică dacă fereastra va fi închisă atunci când apăsați tasta Esc;
Articole similare
Trimiteți-le prietenilor: