Главная › Новости

Javascript открыть всплывающее окно по центру

Опубликовано: 24.08.2018

Readmore.js - плагин скрывающий длинный текст

Для того, чтобы на Javascript открыть всплывающее окно по центру достаточно немного манипуляций.

Javascript открыть всплывающее окно

Для того, чтобы открыть всплывающее окно достаточно вызвать простую команду:

my_window=window.open(url, window_title, params);

В url передаёт строку с адресом нового окна, в window_title заголовок нового окна, в params – параметры.

Javascript открыть всплывающее окно по центру

Вся суть открытия окна по центу в параметрах. В них можно задать ширину, высоту нового окна, а также координаты слева и справа.

JavaScript(JS-Lynda.com) 08 3 Скрыть, показать

То есть нам нужно сначала задать ширину окна и высоту нового окна, а потом на основе них посчитать координаты относительно ширины и высоты экрана.

var main_window_width=screen.width; var main_window_height=screen.height; var new_window_width=400; //ширина нового окна 400 пикс var new_window_height=500; //высота нового окна 500 пикс var new_window_left=(main_window_width-new_window_width)/2; //горизонтальная координата по центру экрана var new_window_top=(main_window_height-new_window_height)/2; //вертикальная координата по центру экрана

А теперь откроем новое окно с параметрами:

var my_window=window.open(url, window_title, 'width='+new_window_width+',height='+new_window_height+',left='+new_window_left+',top='+new_window_top);

Готово, в новое окно откроется по центру экрана с заданными размерами.

50

Понравилась или помогла статья?

Купите мне кофе