window.top.document.body.scrollTop не работает в Chrome или FireFox

Question

У меня есть код ниже, который откроет модальное окно. Это работает в IE 8, но не в Chrome или FF. Я новичок в мире кросс-браузерной функциональности.

function ShowModal(WindowID,FramesetID)
{
    window.onscroll = function () { window.top.document.getElementById(WindowID).style.top = window.top.document.body.scrollTop; };
    window.top.document.getElementById(WindowID).style.display = "block";
    window.top.document.getElementById(WindowID).style.top = document.body.scrollTop;

    widthv=parseInt(parseInt(screen.width)/1.50);
    heightv=parseInt(parseInt(screen.height)/1.50); 

    window.top.document.getElementById(FramesetID).style.width=widthv;
    window.top.document.getElementById(FramesetID).style.height=heightv;
}

Кто-нибудь может помочь сделать этот код совместимым с Chrome & FF?
Я пытался изменить window.top на window.parent, но не повезло Кроме того, какие правила следует учитывать при кодировании для нескольких браузеров (я просматривал, но не нашел какой-либо набор правил для кросс-браузерной совместимости)?

Обновление:
Проблема в том, что в IE это модальное окно появляется примерно в половине размера экрана. В FF и Chrome появляется модальное окно размером с долларовую монету.

Answer 1

В зависимости от текущего режима рендеринга вашего браузера, вам может понадобиться использовать document.documentElement.scrollTop вместо document.body.scrollTop (и аналогично для scrollLeft).

В есть хороший фон для этой проблемыстатья Evolt Питера-Пола Коха (известная из quirksmode.org), но она написана в 2002 году и немного устарела.

Как предлагают другие, самый простой способ решить этот видпроблема в 2011 году заключается в том, чтобы просто использовать существующий JavaScript-фреймворк. jQuery довольно популярен (особенно среди пользователей StackOverflow), но есть и много других .

Answer 2

Другое решение:

(document.documentElement.scrollTop || document.body.scrollTop)

Answer 3

вы можете использовать:

window.pageYOffset

Answer 4

Если вы не видите необходимости в ненужных сторонних библиотеках, вы можете попробовать:

var scrollTop = (document.documentElement || document.body.parentNode || document.body).scrollTop;

Это хакерство, но все же лучше, чем JQuery.

Answer 5

Я бы порекомендовал jQuery, как подсказал Криспанда. JQuery имеет встроенное событие прокрутки, а остальные могут быть записаны в несколько строк, чтобы манипулировать html / css.

http://api.jquery.com/