<style>
#showimg {
position: absolute;
margin-top: 60px;
margin-left: 200px;
}
</style>
<script src="../../scripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
//显示图片
function displayImg(zppath) {
var img = $('#showimg');
//alert("1");
var x = event.clientX + 20;
var y = event.clientY + 5;
$('#showimg').attr("left", x);
$('#showimg').attr("top", y);
//img.style.display = "";
$('#zpimg').attr("src", zppath);
document.getElementById("showimg").style.display = "block";
}
//图片消失
function vanishImg(zppath) {
$('#zpimg').attr("src", "");
var img = $('#showimg');
document.getElementById("showimg").style.display = "none";
//img.style.display = "none";
//alert(zppath);
}
</script>
控件
<div id="showimg">
<img src="" id="zpimg" width="100px" />
</div>
作用显示在名字上,zp 后台Gridview绑定的照片路径
<asp:TemplateField HeaderText="姓名" SortExpression="name" HeaderStyle-HorizontalAlign="Left" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="60px">
<ItemTemplate>
<a href="main.aspx?id=<%# Eval("id") %>" target="_blank" οnmοuseοver="javascript:displayImg('<%#Eval("zp")%>')" οnmοuseοut="javascript:vanishImg('<%#Eval("zp")%>')"><%#Eval("name")%></a>
</ItemTemplate>
</asp:TemplateField>