时间:2021-07-01 10:21:17 帮助过:3人阅读
function ImageDivMouseOver(obj)
{
document.getElementById(obj).style.left=window.event.x+15+document.documentElement.scrollLeft;
document.getElementById(obj).style.top=window.event.y+15+document.documentElement.scrollTop;
}
script>
.showImage a{
display:block;/**//*让链接以块状呈现,这样不用点中链接文字就可以响应链接*/
}
.showImage a img{
display: none; visibility:hidden;/**//*初始化信息面板不显示*/
}
.showImage a:hover{_border:none;text-decoration:none;}/**//*IE7以下版本A状态伪类bug*/
.showImage a:hover img{
display:block;
visibility:visible;
position: absolute;
display:block;
width: 139px;/**//*只给出宽度,高让它随内容多少自动调整*/
border: 1px solid rgb(91,185,233);
background-color: rgb(228,246,255);
z-index:999;/**//*把信息面板提到一个较高的位置,使链接文字过长时不会与面板重叠,但这只对FF有效*/
}
.showImage a img{
border:none;/**//*去除图片边框,默认情况下,链接内的图片在标准浏览器会出现边框*/
display:block;
position: absolute;/**//*用绝对定位抽离正常文本流,不然在设计的时候考虑到不同浏览器正常显示会更麻烦*/
left:80px;
top:30px;
}
.imgStyle{z-index:10px; position:absolute}
优化内容:
1.跟随鼠标
2.增加考虑滚动条因素
3.图片最前位置显示