Question

I have the code below that will open a modal window. This works in IE 8 but not in Chrome or FF. I am new to the world of cross browser functionality.

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;
}

Can anyone help in making this code Chrome & FF compatible?
I tried changing window.top to window.parent but no luck
Also, any rules to keep in mind when coding for multiple browsers (I have browsed through but didn’t quite find any set of rules for cross browser compatibility)?

Update:
The issue is that in IE, this modal window appears in approximately half the screensize. In FF and Chrome, the modal window appears about the size of a dollar coin.

Answer 1

I’d recommend jQuery like chrispanda has suggested. jQuery has a built in scroll event and the rest can be written in just a few lines to manipulate the html / css.

http://api.jquery.com/