I have a column in my gridview that loads images from a database. Right now, I have the image in the column and when you have your mouse over the image, a div with a larger image pops up next to it. What I want to do is have an image of a camera in the column and when you hover over the camera then the div with the proper image shows up. I am going to attach my code at it is. if there is anyone who can help me alter this i would really appreciate it. I don't know anything about javascript! The imgbox is the div. ask of now it is passing in obj which is the image their hovering over (lagrge(this))
function Large(obj)
{
var imgbox=document.getElementById("imgbox");
imgbox.style.visibility='visible';
var img = document.createElement("img");
img.src=obj.src;
img.style.height="180px";
imgbox.innerHTML='';
imgbox.appendChild(img);
}
function Out(obj)
{
document.getElementById("imgbox").style.visibility='hidden';
}
function Move(obj,e)
{
var mouseY=e.clientY;
// alert(e.x)
var mouseX=e.clientX;
var scrollTop=document.documentElement.scrollTop;
var scrollLeft=document.documentElement.scrollLeft;
var y=scrollTop+mouseY+20;
var x=scrollLeft+mouseX+20;
document.getElementById("imgbox").style.left=x + "px";
document.getElementById("imgbox").style.top=y + "px";
}