Displaying Div Tag On MouseOver of LinkButton

Define a div tag in your page & I coded this to show error decription in full view on the mouse over of a linkbutton placed inside a column in gridview

.styleDivPopUp
{

width: 350px;
background-color: #CCCCCC;
border: 2px solid navy;
font-family: Verdana; font-size: 10pt;
display: block; width:650px;
padding-left:5px;
margin-top:2px;
padding-bottom:2px;
}

function ShowErrorDescription(lnkErrorDescription) {

var div = document.getElementById("DivPopUp");
div.innerText = lnkErrorDescription.innerText;

var pTag = document.createElement("p");
pTag.setAttribute("align", "left");
pTag.innerHTML = "<img src='/image/closeButton.jpg' width='30px' onclick='HideErrorDescription()'/>";
div.appendChild(pTag);

div.className = "styleDivPopUp";



var scrolledX, scrolledY;
if (self.pageYoffset) {
scrolledX = self.pageXoffset;
scrolledY = self.pageYoffset;
} else if (document.documentElement && document.documentElement.scrolltop) {
scrolledX = document.documentElement.scrollLeft;
scrolledY = document.documentElement.scrolltop;
} else if (document.body) {
scrolledX = document.body.scrollLeft;
scrolledY = document.body.scrollTop;
}
// Next, determine the coordinates of the center of browser's window

var centerX, centerY;
if (self.innerHeight) {
centerX = self.innerWidth;
centerY = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) {
centerX = document.documentElement.clientWidth;
centerY = document.documentElement.clientHeight;
} else if (document.body) {
centerX = document.body.clientWidth;
centerY = document.body.clientHeight;
}


//Get the Pages width & Height

var Xwidth = 0, Yheight = 0;
if (typeof (window.innerWidth) == 'number') {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}

// Xwidth is the width of the div, Yheight is the height of the
// div passed as arguments to the function:
//var leftoffset = scrolledX + (centerX - Xwidth) / 2;
var leftoffset = 0;
var topoffset = scrolledY + (centerY - Yheight) / 2;
// The initial width and height of the div can be set in the
// style sheet with display:none; divid is passed as an argument to // the function
var o = div
var r = o.style;
r.position = 'absolute';
r.top = topoffset + 'px';
r.left = leftoffset + 'px';
r.display = "block";



}

<asp:LinkButton ID="lnkErrorDescription" runat="server" Text='<%# Server.HtmlEncode(Eval("Remarks").ToString()) %>' onMouseOver="ShowErrorDescription(this);" OnClientClick="return false;" >View</asp:LinkButton> 

Works in following