Как расположить popup окно по центру?
Здравствуйте, есть кнопка по нажатии на которую срабатывает код:
function abuse() {
var popup_abuse_h = (($('body').height()-$('.popup_abuse').height())/2);
var popup_abuse_w = (($(window).width()-$('.popup_abuse').width())/2);
$('.popup_abuse').fadeOut(300).css({'top':popup_abuse_h+'px', 'left':popup_abuse_w+'px'});
if($.browser.msie) {
$('.popup_abuse').css({'display':'block', 'opacity':1});
} else {
$('.popup_abuse').fadeIn(300);
}
}
После окно выводится по центру самого шаблона (а нужно по центру той точки шаблона где нажимается кнопка) Вот как это выглядит сейчас: http://i049.radikal.ru/1210/60/1d41ce7fdd26.png А нужно что бы было вот так: http://s58.radikal.ru/i161/1210/44/ebc46767598d.png Пожалуйста помогите!! |
up
|
left = ( ширина_видимой_области >> 1 ) - ( ширина_окна >> 1 );
|
это можно сделать на голом css
http://jsfiddle.net/fy48x/6/ |
если вкратце - растягиваем обёртку на весь экран, прописываем центрирование текста, для панели задаём инлайн блок и центрируем по вертикали, добавляем к нему псевдоэлемент 100% высоты, чтобы растянуть высоту линии по максимуму
|
Не работает. Все как было так и осталось...
|
tenshi,
а не проще ли сделать так: position: fixed или absolute; left: 1%; (чем меньше тем лучше, главное чтоб left==right) right: 1%; margin: auto; (это сделает по центру) top: 20%; (любые параметры) z-index: 9999; (если это необходимо) вуаля :) самые главные первые 4 параметра |
dmitry111, у тебя по вертикали не центрируется
|
чтобы это сделать нужно указать:
top:1%; bottom: 1%; |
угу, и получится попап на 98% окна и в нём одна маленькая строчка в углу: "данные приняты к обработке")
|
Я прошу вообще то на JS, тут помойму ветка не про css
|
Сделал все сам, достаточно было поменять позицию на фикс и 'body' на window
|
tenshi,
Ну додумайте же.. height укажите и все ок! специально для вас
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
#popup {
width: 30%;
height: 30%;
position: absolute;
top: 1%;
left: 1%;
right: 1%;
bottom: 1%;
margin: auto;
background: #f00;
}
</style>
</head>
<body>
<div id="popup"></div>
</body>
</html>
|
ТС влепил мне минус, за мой ответ в теме
Цитата:
Цитата:
makar3000, на все будущие вопросы, будите отвечать сами. |
Цитата:
|
Цитата:
|
Вот пост о том как сделать центрирование изображения с помощью Javascript, а так же центрирование по вертикали без Javascript.:yes:
|
| Часовой пояс GMT +3, время: 09:35. |