I have a Div and showing that div on click event,that div will showing an image after poping up,problem is that div shows on click in IE but not in Firefox,please help me out, below is the complete javascript and 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 function that call that div is 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('
'); } // // // 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 = '' + '' + title + '' + '' + ''; // 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='h idden'; document.getElementById('dimmer').style.visibility = 'hidden'; DivID = ""; }

You need to post this in a code tag. It's impossible to break this out otherwise.

I do see a "h idden" vs "hidden" keyword towards the end if that helps.

Carl

Plus, separating the code into individual lines, instead of one big string, would be very helpful