Gridview中鼠标移动到项中的小图片后把图片放大

前端代码：

function Test(aa)
    {
    document.getElementById("img1").src ="Image/"+aa;
    document.getElementById("div1").style.display='block';
    document.getElementById("div1").style.position='absolute';
    var x = event.clientX;
    var y = event.clientY;
    document.getElementById("div1").style.left = x;
    document.getElementById("div1").style.top = y;
    }
    function Hide()
    {
    document.getElementById("div1").style.display='none';
    }

<div id ="div1" style="display:none;">
    <img src ='' id="img1" width="150px" height="150px"/>
    </div>
    <div>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
            <Columns>
                <asp:TemplateField HeaderText="头像">
                    <ItemTemplate>
                        <img src='Image/<%#Eval("ImagePath") %>' onmouseout="Hide()" onmouseover="Test('<%#Eval("ImagePath") %>')"  width="70px" height="80px" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField DataField="UserName" HeaderText="用户名" />
                <asp:BoundField DataField="Age" HeaderText="年龄" />
                <asp:BoundField DataField="Email" HeaderText="邮箱" />
                <asp:BoundField DataField="Address" HeaderText="地址" />
            </Columns>
        </asp:GridView>

后台代码：

 protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            databind();
        }
    }
    public void databind()
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["Conn"].ToString());
        SqlCommand cmd = new SqlCommand();
        cmd.Connection = con;
        cmd.CommandText = "Select * From T_Users";
        SqlDataAdapter da = new SqlDataAdapter(cmd);
        DataSet ds = new DataSet();
        da.Fill(ds);
        this.GridView1.DataSource = ds.Tables[0];
        this.GridView1.DataKeyNames = new string[] { "id" };
        this.GridView1.DataBind();
    }