弹力球事件

最新推荐文章于 2021-03-11 06:41:26 发布

1997ysm

最新推荐文章于 2021-03-11 06:41:26 发布

阅读量285

点赞数

本文链接：https://blog.csdn.net/m0_38052499/article/details/71512315

版权

把图片路径改为你的路径就好，亲测有效

<!DOCTYPE html>

<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
img{
position: absolute;
top: 0;
left: 0;
}
</style>
</head>
<body>
<img src="../image/45.jpg" id="imgid"/>
</body>
<script>
img=document.getElementById('imgid');
ys=0;
yv=10;
xs=0;
xv=10;
h=document.documentElement.clientHeight;
w=document.documentElement.clientWidth;
imgh=300;
imgw=500;
cha=h-imgh;
cha1=w-imgw;
setInterval(function(){

ys+=yv;
if(ys>=cha){
ys=cha;
yv=-yv;
}
if(ys<=0){
yv=-yv;
}
img.style.top=ys+'px';
xs+=xv;
if(xs>=cha1){
xs=cha1;
xv=-xv;
}
if(xs<=0){
xv=-xv;
}
img.style.left=xs+'px';
},50);
</script>
</html>