Сделать сайт закрытым Прыжки в начало страницы

Question

Итак, проблема в том, что каждый раз, когда мой обложка/модальная информация появляется на моем веб-сайте, она имеет тенденцию превращать веб-сайт обратно в начало. Мне нужны инструкции для эмуляции проблемы, так что вы можете увидеть:

• Перейти к этой ссылке: http://jsbin.com/saditujuli/edit?html,css,js,output

• Нажмите кнопку 'Запуск с JS' в правом верхнем углу. Прокрутите страницу до нижней части раздела 'output' и нажмите на позицию: фиксированный синий сингл в
  верхний правый угол.

• Оттуда вы можете увидеть, как веб-сайт прыгает из-за полупрозрачного фона обложки, и вы также можете сказать, что когда вы выходите из (обложки, модальные), веб-сайт находится наверху, поэтому он прыгнул.

Когда крышка приходит, она должна быть позиция: фиксированная, так что он не будет move.It предназначен, чтобы остаться на месте, когда синий тикер нажал вместо прыжков, но я не» я знаю, как это исправить. Любая помощь приветствуется. Спасибо заранее!

Answer 1

Если это ваш исходный код:

$('.responsive_click').on('click',function(){ 
     $('.cover').fadeIn('slow'); 
     $('.container').css('position','fixed'); 
    }); 

    $('.close-sign').on('click',function(){ 
     $('.cover').fadeOut('slow'); 
     $('.container').css('position','relative'); 
    }); 

я изменил «.container» в „теле“ и „позиция: фиксированная/отн“ переполнение-у: скрытый/прокручивать», как показано здесь:

$('.responsive_click').on('click',function(){ 
    $('.cover').fadeIn('slow'); 
    $('body').css('overflow-y','hidden'); 
    }); 

    $('.close-sign').on('click',function(){ 
    $('.cover').fadeOut('slow'); 
    $('body').css('overflow-y','scroll'); 
    }); 

Это останавливает фон, прыгающий обратно в верхнюю и фоновую прокрутку, в то время как оверлей синего тикера опущен.

EDIT: Для мобильных устройств, пытаясь добавлять window.ontouchmove = preventDefault; так:

$('.responsive_click').on('click',function(){ 
    $('.cover').fadeIn('slow'); 
    $('body').css('overflow-y','hidden'); 
    window.ontouchmove = preventDefault; 
    }); 

и просто изменить 'preventDefault' до 'нулевой' при закрытии диалогового окна.

Answer 2

Что делать, если вы попытаетесь изменить положение контейнера на фиксированное?

position:fixed; 

Answer 3

$('.responsive_click').on('click',function(){ 
    $('.cover').fadeIn('slow'); 
    $('.container').css('position','absolute'); 
    }); 

    $('.close-sign').on('click',function(){ 
    $('.cover').fadeOut('slow'); 
    $('.container').css('position','relative'); 
    }); 

Изменение положения контейнера: абсолютная