<head>
</head>
<body>
<div id="marqueeDiv"style="position:absoluteleft:0px"><img src="1.jpg" style="width:100px" onmouseover="showImg(this)"></div>
<script type="text/javascript">
var width=document.body.offsetWidth-100
var left=0
var flag='add'
function marquee(){
if(left>=width){
flag='cut'
}
if(left<=0){
flag='add'
}
if(flag=='add'){
left+=2
}else if(flag=='cut'){
left-=2
}
var marqueeDiv=document.getElementById("marqueeDiv")
marqueeDiv.style.left=left+"px"
setTimeout("marquee()",10)
}
setTimeout("marquee()",100)
function showImg(obj){
obj.style.width="200px"
}
</script>
</body>
</html>
没有做onmouseleave和onmouseout事件。
很简单啊，先把图片用css缩小，再用js滑过的时候放大就好啦，图省事我就把js直接写在图片上了，你可以自己抽出来：<img src="1.jpg" width="50" height="50" onMouseOver="this.width='300'this.height='300'" onMouseOut="this.width='50'this.height='50'">
或者更简单的，直接用css控制，连js都不用写了：
<style>
#Img1{ width:50pxheight:50px}
#Img1:hover{ width:300pxheight:300px}
</style>
<img src="1.png" width="50" height="50" id="Img1">
