常见的悬浮广告-简易版本的

<style type="text/css">
div{
position:relative;
width: 200px;
height: 200px;
}
img{
width: 200px;
height: 200px;
position: absolute;
border-radius: 50%;
}
</style>

</head>
<body>
<div id="floatdiv"><img src="img/god.gif"></div>
</body>
</html>
<script type="text/javascript">

var div=document.getElementById("floatdiv");
var x=0,y=0;
var xSpeed=2,ySpeed=2;
var w=document.body.clientWidth-200,h=document.body.clientHeight-100;
function floatdiv(){
if(x>w||x<0) xSpeed= -xSpeed;
if(y>h||y<0) ySpeed= -ySpeed;

x+=xSpeed;
y+=ySpeed;

div.style.top=y+"px";
div.style.left=x+"px";
setTimeout("floatdiv()",10);
}
floatdiv();
</script>

posted on 2017-08-18 15:10  辣子倩  阅读(210)  评论(0编辑  收藏  举报