Cum de a face un formular de feedback într-o fereastră pop-up

Tag-uri: formă, modal, fereastra, fereastra pop-up

In acest articol vom discuta despre cel mai simplu mod de a crea o fereastră modal cu un fundal umbrit, al cărui interior este o formă de feedback.

Pentru a începe o structură de fișier:

index.html - fișier aspect de bază
css / template.css - fișier de stil într-un dosar special
js / popup.js - fișier cu script-uri de fereastra pop-up noastre

Din moment ce folosim biblioteca jQuery. nu uitați să-l conectați index.html.

Vom lua în considerare doar o modalitate de a crea formulare de feedback pop-up, în opinia noastră, cea mai simplă și nu necesită aproape nici un script-uri.

Ideea este aceasta. Inițial, vom bloca că întreaga pagină va fi pe partea de sus a, al cărui interior este blocul responsabil pentru fundal întunecat și blocul cu formularul de feedback. Unitatea principală este ascunsă de un afișaj. nici unul. Făcând clic pe butonul care arată feedback-ul formular va apărea treptat, atunci când faceți clic pe un fundal întunecat, pur și simplu se estompeze treptat.

Facem un -razmetki HTML gol:

Următorul pas - pentru a pregăti stiluri de fișiere cere clase de bază pop-up parametrii necesari și se adaugă unele frumusete:

Și adaugă destul de un pic de -Code js în popup.js:

un exemplu de rezultatul pe care îl puteți vedea pe pagina demo:

exemple de cod sursă pentru download link-ul de mai jos:

Bună ziua. Explică coder novice. Am acest scenariu nu funcționează. Și eu nu înțeleg cum va funcționa dacă nu este descris un eveniment atunci când este apăsată o tastă. Sau toate la fel nu sunt foarte competenți în acest domeniu.
$ ( 'Show_popup.') Faceți clic pe (showPopup funcție () $ ( "pop-up".) FadeIn (800) .. // afișează imagini Slow
>)
în acest fel funcția de a lucra. Numai în continuare nevoie pentru a da butonul de clasă

Bună ziua, ai dreptate, vom vedea un exemplu de demo nu este copiat codul, dar în versiunea noastră, vom adăuga butonul nu este o clasă, și onClick atribuie parametrul „showPopup ();“

Nu se întâmplă nimic. Ajutor !! Doar această formă este necesară, în timp ce !! & Downloadeaza, și copiat de pe pagina, este nu se deschide. Nu js BumBum. Dacă arunca la e-mail, aș fi foarte recunoscător. Va multumesc !!