Створюємо спливаюче модальне вікно jquery

Швидше за все Ви вже не раз бачили в інтернеті спливаюче модальне вікно - підтвердження реєстрації, попередження, довідкова інформація, завантаження файлу і багато іншого. У цьому уроці я запропоную кілька прикладів зі створення найпростіших модальних вікон.

Створюємо просте спливаюче модальне вікно

Приступимо до розгляду коду найпростішого модального вікна, яке буде одразу з'являтися

Увага! Нагадую, що для роботи з jQuery необхідно підключити саму бібліотеку на сторінку або сайту. В іншому випадку нічого працювати не буде.

Код вставляєте в будь-яке місце в body Вашої сторінки. Відразу після завантаження сторінки, без будь-яких команд, Ви побачите вікно наступного вигляду:

А ось наступний код буде виконуватися після завантаження всієї сторінки в браузер. У нашому прикладі після завантаження сторінки із зображеннями вискочить просте спливаючі віконце:

Виклик модального вікна jQuery по посиланню з CSS

Наступним кроком буде створення модального вікна при натисканні на посилання. Фон при цьому буде повільно затемнюватися.

Часто можете бачити, що форма входу і реєстрації знаходяться саме в таких вікнах. Приступимо до справи

Для початку напишемо html-частина. Цей код розміщуємо в body Вашого документа.

Код CSS. Або в окремому css-файлі, або в