Die skepping van 'n pop-upvenster in HTML geskied met behulp van die jQuery-biblioteek, waarmee u 'n gebeurtenishanteerder in 'n webblad kan integreer en sodoende die aktiewe inhoud van die webwerf kan vertoon.
Instruksies
Stap 1
Open u HTML-werfblad in die teksverwerker wat u gebruik om die kode te skryf. U kan ook die standaard Windows Notepad-hulpprogramma gebruik om 'n pop-upvenster in te voeg. Om dit te doen, klik met die rechtermuisknop op die HTML-lêer en kies "Open Met" - "Notepad".
Stap 2
Maak in die dokumentafdeling 'n laag wat jQuery sal hanteer:
Stap 3
Dan moet u die naam van die pop-upvenster instel. Om dit te doen, kan u die opgestelde HTML-opskrifte gebruik:
Venster titel
Stap 4
Stel daarna die teks wat in die venster vertoon word met behulp van die skrif om 'n paragraaf te skep:
Teks
Stap 5
Skep dan 'n laag met class close_win om die pop-up te sluit voordat u die vorige handvatsel sluit:
Maak 'n venster toe
Stap 6
Sluit die jQuery-biblioteek in die lêer deur die vereiste etiket tussen die dokumentbeskrywers by te voeg. Byvoorbeeld:
Stap 7
Voer daarna die kode in om die pop-up te vertoon:
$ (funksie () {
$ ('# Show'). Versteek ();
Stap 8
Vervolgens moet u die gebeurtenis hanteer dat die gebruiker op die muisknop gedruk het om die pop-upvenster aan te roep en die sluiting van die venster te hanteer. Om dit te doen, voer die volgende kode in:
$ ('# Click-me'). Klik (funksie () {$ ('# show'). Fadein (300);})
$ ('# Close_win'). Klik op (funksie () {$ ('# show'). FadeOut (300);})
& lt / skrif>})
Hierdie program hanteer die gebruiker wat op die knoppies druk om die pop-upvenster aan te roep en op die skakel te klik om dit te sluit.
Stap 9
Om die pop-upvenster op die bladsy te vertoon, kan u die skakel van die klikklas gebruik wat in die kode hierbo gespesifiseer is. Om dit te doen, voer die volgende kode in die liggaam van die dokument in:
Klik om pop-up te wys
