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

Я предполагаю, что jQuery / JS будет лучшим способом для этого; Вот мой текущий CSS-код, который работает довольно хорошо, но для маленьких экранов div нужно динамически перемещать в видимое пространство.

.my-div{
    width:960px;
    height:540px;
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-480px;
    margin-top:-270px;
    z-index:60;
    display:none;
}