兼容谷歌,火狐,ie789+
<!-- onmouseover事件,鼠标移动显示图片 ..start-->
function showImg(url){
var url = "${httpfileurl}"+url;
$("#changeImg").attr("src",url);
var divObj = document.getElementById("changeDiv");
var clientX = 0;
var clientY = 0;
var event=getEvent();
if (navigator.appName=='Microsoft Internet Explorer') {
clientX = event.x;
clientY = event.y;
}else if (navigator.appName=='Netscape') {
clientX = event.pageX;
clientY = event.pageY;
}
divObj.style.left = clientX +"px";
divObj.style.top = clientY +"px";
divObj.style.display="";
}
function hideImg(){
$("#changeDiv").hide();
}
// 兼容ie和Ff的,获取鼠标移动事件
function getEvent()
{
if(document.all) return window.event;
func=getEvent.caller;
while(func!=null){
var arg0=func.arguments[0];
if(arg0)
{
if((arg0.constructor==Event || arg0.constructor ==MouseEvent) || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))
{
return arg0;
}
}
func=func.caller;
}
return null;
}
<!-- onmouseover事件,鼠标移动显示图片 ..end-->
<!-- onmouseover事件,鼠标移动显示图片 -->
<div id='changeDiv' style="position:absolute;display:none">
<span style="white-space:pre"> </span><img id="changeImg" width="100" height="100" />
</div>
<td align="left" id="${datas.id}" οnmοuseοver="showImg('${datas.imageUrl}');" οnmοuseοut="hideImg();" nowrap>${datas.imageUrl}</td>
效果:<img src="https://img-blog.csdn.net/20140804224612562" alt="" />