0

ПО этой теме много вариантов решения

Вот столкнулся с такой проблемой

<a href="#" data-reveal-id="myModal" data-animation="fade">Заказать звонок</a>

<!--modal-->
<div id="myModal" class="reveal-modal">
   <p>Содержимое модального окна</p>                        
   <a class="close-reveal-modal" title="Закрыть"><span>X</span></a>
</div>

.reveal-modal-bg { 
    position: fixed; top: 0; left: 0;
    height: 100%;
    width: 100%;
    background: #000;
    background: rgba(0,0,0,.85);
    z-index: 150;
    display: none;  
}   
.reveal-modal{      
    visibility: hidden; 
    position: fixed; top: 150px; left: 50%;
    margin: 0 0 0 -159px;
    width: 318px;   
    background: #fff;
    padding: 10px 0 20px 0;
    z-index: 151;   
    box-shadow: 0 0 10px rgba(0,0,0,.4);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
    border: none;   
    text-align: center;  
}

Все вроде нормально работает. Но при не большой прокрутке и клике на кнопку вызова модального окна - центровка окна пропадает. Подскажите, в чем может быть проблема

http://szsi.com.ua/page/page20/

1 ответ 1

2

Проблема у тебя в JS коде, чем ниже тем больше отступ от топа, откроешь JS увидишь сразу.

7
  • я использую плагин
    – soledar10
    15 ноя 2013 в 14:23
  • Да ладно? Исправьте.
    – avengerweb
    15 ноя 2013 в 14:25
  • if(options.animation == "fade") { modal.css({'opacity' : 0, 'visibility' : 'visible', 'top': $(document).scrollTop()+topMeasure}); modalBG.fadeIn(options.animationspeed/2); modal.delay(options.animationspeed/2).animate({ "opacity" : 1 }, options.animationspeed,unlockModal()); }
    – avengerweb
    15 ноя 2013 в 14:25
  • 1
    topMeasure = parseInt(modal.css('top'))
    – avengerweb
    15 ноя 2013 в 14:26
  • 1
    Так сложно? $(document).scrollTop() + topMeasure - в вашем случае 150px, чем ниже уходишь в низ, тем более будет прибавляться и тем ниже будет опускаться окно. То есть нужно сделать вместо '$(document).scrollTop() + topMeasure' 'topMeasure' и тогда вы будете получать высоту только вытащенную из CSS.
    – avengerweb
    15 ноя 2013 в 14:27

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.