图片沿当前浏览器边缘移动(不会出现滚动条)
代码如下
//Css and Javascript
<style type="text/css">
body,img{margin:0px;padding:0px;}
img{
width:320px;
height:200px;
left:0px;
top:0px;
position:absolute;
}
</style>
<script type="text/javascript">
function show()
{
var winWidth = document.documentElement.clientWidth-2;
var winHeight = document.documentElement.clientHeight-2;
var obj = document.images.item(0);
var imgWidth = obj.width;
var imgHeight = obj.height;
var x = obj.offsetLeft;
var y = obj.offsetTop;
if(x+imgWidth <= winWidth && y+imgHeight == imgHeight)
{
obj.style.left = (x+5)+'px';
}
else if(x+imgWidth >= winWidth && y+imgHeight <= winHeight)
{
obj.style.top = (y+5)+'px';
}
else if((x+imgWidth >= winWidth || x+imgWidth <= winWidth) && y+imgHeight >= winHeight && x+imgWidth>=imgWidth)
{
obj.style.left = (x-5)+'px';
}
else
{
obj.style.top = (y-5)+'px';
}
setTimeout('show()',1);
}
</script>
// Body
<body>
<img src="桌面壁纸/aifeier.jpg" alt="图片" οnclick="show()" />
</body>