Div not showing in Firefox

[adeelansari_leo]

I want to show my image in external div,so in IE it shows fine but in firefox it is not showing in,below is the CSS and javascript function for this,in page the HTML of the page is in which i am given that div in which image will be shown,please help me out

<DIV style="VISIBILITY: hidden; WIDTH: 518px; HEIGHT: 287px" id="windowcontent">
<TABLE cellpadding="2" cellspacing="0" border="0" width="100%" height="100%">
<TR>
<TD align="center" valign="middle">
<IMG align="middle" id="imgLargeImage">
</TD>
</TR>
</TABLE>
</DIV>


CSS:-

.BlueBar { PADDING-LEFT: 15px; FONT-WEIGHT: bold; COLOR: #ffffff; BACKGROUND-COLOR: #79a3cf }
DIV.dimmer { PADDING-RIGHT: 40px; PADDING-LEFT: 40px; FONT-WEIGHT: bold; FILTER: progidXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='/images/SKIP_please_wait.gif'); LEFT: 0px; BACKGROUND-IMAGE: none; VISIBILITY: hidden; PADDING-BOTTOM: 40px; PADDING-TOP: 40px; FONT-FAMILY: verdana; POSITION: absolute; TOP: 0px }
DIV.dimming { BORDER-RIGHT: #999999 1px solid; BORDER-TOP: #999999 1px solid; FONT-SIZE: 11px; Z-INDEX: 10000; VISIBILITY: hidden; BORDER-LEFT: #999999 1px solid; BORDER-BOTTOM: #999999 1px solid; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; POSITION: absolute; BACKGROUND-COLOR: #ffffff }



//the first function that accept imageurl and passing the parameters to the below mentioned function

function ShowImagePopup(imgUrl)
{

var oImg = document.getElementById("imgLargeImage");
oImg.src = imgUrl;
var w,h;

w = oImg.width + 40 ;
h = oImg.height + 25 ;
displayWindow(w,h);
}





var isMozilla;
var objDiv = null;
var originalDivHTML = "";
var DivID = "";
var over = false;


function displayWindow(w,h)
{
debugger;
var w, h, l, t;
l = event.clientX;
t = event.clientY;
//l = screen.width / 4;
//t = screen.height / 4;

//l = document.body.scrollWidth / 2 - w/2;
//t = document.body.scrollHeight / 2 - h/2;

// no title
// displayFloatingDiv('windowcontent', '', w, h, l, t);

// with title
displayFloatingDiv('windowcontent', 'Image Viewer', w, h, l, t);
}


//
// dinamically add a div to
// dim all the page
//
function buildDimmerDiv()
{
document.write('<div id="dimmer" class="dimmer" style="width:'+ window.screen.width + 'px; height:' + window.screen.height +'px"></div>');
}


//
//
//
function displayFloatingDiv(divId, title, width, height, left, top)
{
debugger;
DivID = divId;

document.getElementById('dimmer').style.visibility = "visible";

document.getElementById(divId).style.width = width + 'px';
document.getElementById(divId).style.height = height + 'px';
document.getElementById(divId).style.left = left + 'px';
document.getElementById(divId).style.top = top + 'px';

var addHeader;

if (originalDivHTML == "")
originalDivHTML = document.getElementById(divId).innerHTML;

addHeader = '<table style="width:' + width + 'px" class="BlueBar">' +
'<tr><td ondblclick="void(0);" onmouseover="over=true;" onmouseout="over=false;" style="cursor:move;height:18px">' + title + '</td>' +
'<td style="width:18px" align="right"><a href="javascript:hiddenFloatingDiv(\'' + divId + '\');void(0);">' +
'<img alt="Close..." title="Close..." src="/images/buttons/cross_icon.gif" width="10px" border="0"></a></td></tr></table>';


// add to your div an header
document.getElementById(divId).innerHTML = addHeader + originalDivHTML;


document.getElementById(divId).className = 'dimming';
document.getElementById(divId).style.visibility = "visible";


}


//
//
//
function hiddenFloatingDiv(divId)
{
debugger;
document.getElementById(divId).innerHTML = originalDivHTML;
document.getElementById(divId).style.visibility='hidden';
document.getElementById('dimmer').style.visibility = 'hidden';

DivID = "";
}