Tworzenie wyskakującego okienka w HTML odbywa się za pomocą biblioteki jQuery, która pozwala zintegrować obsługę zdarzeń ze stroną internetową, a tym samym umożliwia wyświetlanie aktywnej zawartości witryny.
Instrukcje
Krok 1
Otwórz stronę swojej witryny HTML w edytorze tekstu, którego używasz do napisania odpowiedniego kodu. Możesz także użyć standardowego narzędzia Windows Notepad, aby wstawić wyskakujące okienko. Aby to zrobić, kliknij prawym przyciskiem myszy plik HTML i wybierz „Otwórz za pomocą” - „Notatnik”.
Krok 2
W sekcji dokumentu utwórz warstwę, która obsłuży jQuery:
Krok 3
Następnie musisz ustawić nazwę wyskakującego okienka. Aby to zrobić, możesz użyć warstwowych nagłówków HTML:
Tytuł okna
Krok 4
Następnie ustaw tekst, który będzie wyświetlany w oknie za pomocą skryptu, aby utworzyć akapit:
Tekst
Krok 5
Następnie utwórz warstwę z klasą close_win, aby zamknąć wyskakujące okienko, przed zamknięciem poprzedniego uchwytu:
Zamknij okno
Krok 6
Dołącz bibliotekę jQuery do pliku, dodając wymagany znacznik między deskryptorami dokumentów. Na przykład:
Krok 7
Następnie wprowadź kod, aby wyświetlić wyskakujące okienko:
$ (funkcja () {
$ („# Pokaż”) Ukryj ();
Krok 8
Następnie musisz obsłużyć zdarzenie, w którym użytkownik nacisnął przycisk myszy, aby wywołać wyskakujące okienko i obsłużyć zamknięcie okna. W tym celu wprowadź następujący kod:
$ („# kliknij mnie”). Kliknij (funkcja () {$ („# pokaż”)). Fadein (300);})
$ („# Close_win”). Kliknij (funkcja () {$ („# pokaż”). Zanikanie (300);})
& lt / skrypt>})
Ten program obsługuje użytkownika naciskając przyciski do wywołania wyskakującego okna i klikając łącze, aby je zamknąć.
Krok 9
Aby wyświetlić wyskakujące okienko na stronie, możesz użyć linku klasy click-me, który został określony w powyższym kodzie. Aby to zrobić, wprowadź następujący kod w treści dokumentu:
Kliknij, aby wyświetlić wyskakujące okienko