Показать сообщение отдельно
  #1 (permalink)  
Старый 04.03.2017, 12:53
Аватар для shyxeroks
Аспирант
Отправить личное сообщение для shyxeroks Посмотреть профиль Найти все сообщения от shyxeroks
 
Регистрация: 02.03.2017
Сообщений: 38

Вычислить длину модального окна
Приветствую. Возник вопрос, возможно ли вычислить длину модального окна до его появления, для того что-бы размещать всегда по центру экрана в видимой области, так как длина всегда разная. Или по средствам css возможно?
<style>
/******************** Modal ******************/
#modal_form {
	width: 500px; 
	border-radius: 5px;
	border: 3px #000 solid;
	background: #fff;
	position: fixed;  
	left: 50%; 
	margin-left: -250px; 
	display: none; 
	opacity: 0; 
	z-index: 5; 
	padding: 5px;
	border:3px solid #b88c27;
	color:#b88c27;
}
#modal_form #modal_close {
	background: #b88c27;
	color: #FFFFFF;
	line-height: 25px;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -10px;
	width: 24px;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
	cursor:pointer;
}
#modal_form #modal_close:hover {background: red;}
#modal_overlay {/*подложка */
	z-index: 3; 
	position: fixed; 
	background-color: #000; 
	opacity: 0.8;
	width: 100%; 
	height: 100%;
	top: 0; 
	left: 0; 
	cursor: pointer;
	display: none; 
}
</style>
Вызывается так:
<script>
function show_notice(text,color){
$('#modal_overlay').fadeIn(400,function(){ 
$('#modal_form').css({'display':'block', 'border-color':color}).animate({opacity: 1, top: '50%'}, 200);
$('#modal_text_add').html(text).css('color',color);
});
}
</script>

Благодарю за информацию!
Ответить с цитированием