Всплывающее окно прокручивается вверх при закрытии

/*CSS */  
#popup { background-color: #fff; border: 1px #000 solid; display: block; position: fixed; padding: 20px; top: 200px; left: 50%; margin-left: -300px; width: 600px; z-index: 1; }

/* JQuery */
$('#show-popup').live('click', function() 
    {
        var tempWindow = $('<div id="popup">This is a draggable pop-up window created with JQuery and JQuery UI <a href="#" id="popup-close">Close</a></div>').draggable();
        $('body').append(tempWindow);
    });

$('#popup-close').live('click', function()
{
    $(this).parent().remove();
});

/* HTML */
<a href="#" id="show-popup">Open popup window</a>

Всплывающее окно работает, оно открывается нормально, вы можете перетаскивать его по странице, и оно остается на своем месте, но когда вы его закрываете, оно прокручивается обратно в начало страницы. Как я могу предотвратить это?


html jquery popup window
person TheMagician    schedule 20.10.2009    source источник
comment
-1 Здесь почти нет деталей   -  person Josh Stodola    schedule 21.10.2009

Ответы (3)


arrow_upward
2
arrow_downward

Догадаться; Забыл вернуть false при нажатии на ссылку закрытия, чтобы она перенаправлялась на page.php#.

person TheMagician    schedule 20.10.2009

arrow_upward
0
arrow_downward

В событии закрытия сохраните координаты окна в переменной.

var coords = $('#popup').position();

Затем, когда вы откроете его, установите его в то же место.

$('<div id="popup">...</div>').css({position: 'absolute', top: coords.top, left: coords.left});

Здесь отсутствует некоторая логика, поскольку у вас нет тонны деталей, но это должно сработать.

person Alex Sexton    schedule 20.10.2009
comment
Плохо, забыл добавить код для закрытия всплывающего окна... Во всяком случае, проблема в том, что когда я открываю всплывающее окно, немного прокручиваю вниз и закрываю его (теперь со всем необходимым кодом в первом сообщении), оно прокручивается обратно к вверху страницы автоматически. Еще раз спасибо. - person TheMagician; 21.10.2009

arrow_upward
0
arrow_downward

попробуй это

$('html, body').animate({ scrollTop: 0 }, 'slow');
person gowtham ks    schedule 17.11.2014