Борознячи простори глобальної павутини, я думаю, ви не раз стикалися з подібними спливаючими вікнами. Не дивлячись на те, що у користувачів приходять на ваш сайт вже даними давно виробився інстинкт: "Бачу спливаюче вікно - відразу закриваю!", Нам все одно може стати в нагоді даний скрипт. А з цього, чи не повільно приступимо до його розробки.

Готуємо вікно до спливання.

Файл стилів windowstyle.css ми не будемо розглядати детально, тому що він дуже великий і не володіє правом витрачати наш час. Просто скачайте його разом з необхідним набором картинок.

Перенесемо картинки з вмісту архіву в папку images. а також замінимо наш windowstyle.css і продовжимо підготовку. Для завершення церемонії приготування, нам залишається створити HTML код майбутнього спливаючого вікна.

Ось таким повинен вийти файл window.html

контент сторінки

Спливаюче вікно jQuery

Показати спливаюче вікно

Отже, шановні читачі, вітаю, підготовча частина закінчена, і ми можемо перейти до призначення даної статті, а саме до написання скрипта.

Пишемо скрипт "спливаюче вікно jQuery"

На цьому етапі ми маємо вже сформований вікно, яке в першу чергу потрібно приховати, а в наслідку, при натисканні на блок showWindow воно повинно плавно відобразитися.

Наступний шматочок коду як це не дивно вже робить левову частку функціоналу: