Простое модальное окно на JQuery

Простое модальное окно на JQuery

12.05.201151496

Создать модальное окно на своем сайте не так сложно, как кажется на первый взгляд. Использовать простое модальное окно на JQuery в такой ситуации лучше всего, ведь это позволит анимировать определенные действия. Если никаких познаний в этом у Вас не имеется, то советую воспользоваться приведенной инструкцией. В данном примере при клике на ссылку открывается, появляется блок в центре экрана, остальная часть затемняется, что фокусирует внимание пользователя на модальном окне.

Пример

Простое модальное окно
Простое модальное окно
Закрыть


Если на сайте не подключен плагин JQuery, то воспользуемся следующим кодом (вставить между тегами <head> и </head>).



Код JavaScript



Код CSS



Код HTML




Сохраните в социальную сеть
Комментарии (6)
Сергей 15.10.2011 в 21:56Спам
Можно ли сделать чтобы окно двигалось вместе со страницей ? А то оно постоянно вверху висит....
2
Использовать фиксированное положение
1
Гость 18.11.2011 в 20:20Спам
А как это сделать ?
0
position:absolute; меняем на position:fixed;
Для IE оставляем position:absolute;
2
Гость 20.03.2012 в 06:57Спам
а почему окно все время по центру экрана, как сделать чтобы было в правом верхнем углу???
-1
right:0px; top:0px; прижмет в правом верхнем
0
Чтобы оставить комментарий под этой публикацией,
зарегистрируйтесь или войдите.
Рейтинг лучших сервисов для самостоятельного создания сайта.
Лучшие конструкторы
Легко! Если пользоваться нашими советами.
Создать сайт