#demo{overflow:hiddenwidth:120pxtext-align:centerpadding:10px}
#demo img{border:nonewidth:100pxheight:100pxborder:5px solid #f4f4f4}
#enlarge_images{position:absolutedisplay:nonez-index:2border:5px solid #f4f4f4}
</style>
<div id="demo" style="overflow:hiddenwidth:120pxtext-align:centerpadding:10px">
<img src="http://www.makewing.com/images/uppic/200801101244190.jpg">
</div>
<div id="enlarge_images"></div>
<script>
var demo = document.getElementById("demo")
var gg = demo.getElementsByTagName("img")
var ei = document.getElementById("enlarge_images")
for(i=0i<gg.lengthi++){
var ts = gg[i]
ts.onmousemove = function(event){
event = event || window.event
ei.style.display = "block"
ei.innerHTML = '<img src="' + this.src + '" />'
ei.style.top = document.body.scrollTop + event.clientY + 10 + "px"
ei.style.left = document.body.scrollLeft + event.clientX + 10 + "px"
}
ts.onmouseout = function(){
ei.innerHTML = ""
ei.style.display = "none"
}
ts.onclick = function(){
window.open( this.src )
}
}
</script>
有两种方法实现
可以用css背景图片做定位(这个你可以去W3CSchool查看一下background的相关属性)
用两个元素, 块元素A和img元素B, A中嵌套B, A用"position:relative"固定宽高, 并设置overflow为hidden, B元素用"position:absolute"设置top和left,
<body style="background:url(3a.jpg)"><div id="header" class="container_16">
<h1 class="grid_7">信息技术学院</h1>
<ul class="grid_9">
<li><a href="#" class="current">首页</a></li>
<li><a href="#">教学科研</a></li>
<li><a href="#">老师队伍</a></li>
<li><a href="#">招生就业</a></li>
<li><a href="#">国际化办学</a></li>
<li><a href="#">学生工作</a></li>
<li><a href="#"><img src="I:\期末作业\xxxy\images\bg.jpg" alt="" /></a><li>
</ul>
</div>
</body>
在body里加背景，你的代码怎么连个body都没有、、、
