Създаването на изскачащ прозорец в HTML се извършва с помощта на библиотеката jQuery, която ви позволява да интегрирате манипулатора на събития в уеб страница и по този начин да направите възможно показването на активното съдържание на сайта.
Инструкции
Етап 1
Отворете страницата на вашия HTML сайт в текстовия редактор, който използвате, за да напишете кода, който искате. Можете също да използвате стандартната помощна програма на Windows Notepad, за да вмъкнете изскачащ прозорец. За да направите това, щракнете с десния бутон върху HTML файла и изберете „Отваряне с“- „Бележник“.
Стъпка 2
В раздела за документи създайте слой, който ще обработва jQuery:
Стъпка 3
След това трябва да зададете името на изскачащия прозорец. За да направите това, можете да използвате нивото на HTML заглавките:
Заглавие на прозореца
Стъпка 4
След това задайте текста, който ще се показва в прозореца, като използвате скрипта, за да създадете абзац:
Текст
Стъпка 5
След това създайте слой с клас close_win, за да затворите изскачащия прозорец, преди да затворите предишния манипулатор:
Затворете прозорец
Стъпка 6
Включете библиотеката jQuery във файла, като добавите необходимия таг между дескрипторите на документа. Например:
Стъпка 7
След това въведете кода за показване на изскачащия прозорец:
$ (функция () {
$ ('# Show'). Hide ();
Стъпка 8
След това трябва да се справите със събитието, че потребителят е натиснал бутона на мишката, за да извика изскачащия прозорец и да се справи със затварянето на прозореца. За да направите това, въведете следния код:
$ (‘# Click-me’). Кликнете (function () {$ (‘# show’). Fadein (300);})
$ (‘# Close_win’). Щракнете върху (function () {$ (‘# show’). FadeOut (300);})
& lt / script>})
Тази програма обработва потребителя, като натиска бутоните за извикване на изскачащия прозорец и кликва върху връзката, за да го затвори.
Стъпка 9
За да се покаже изскачащият прозорец на страницата, можете да използвате връзката на класа за щракване, посочен в горния код. За да направите това, въведете следния код в тялото на документа:
Щракнете за показване на изскачащ прозорец
