js實現隨機圖片變動

思路:

設置div左上角座標起始點爲(0,0);
var x=0,y=0;

設置圖片的最大浮動寬度和高度
 獲取屏幕寬高

代碼:

<html>

<head>

<title>隨機圖片</title>

<style>
div{
position:absolute;
}
</style>

</head>

<body>
<div id="img">
<img src="68fa0919jw1dmxvz3gsz0g.gif" width="130" height="150" />
</div>

</body>
</html>

<script language="javascript" type="text/javascript">
//獲取對象
var img= document.getElementById("img");

var w=document.documentElement.clientWidth-130, h=document.documentElement.clientHeight-150;
function floatimg(){

 var x=Math.round(Math.random()*w);
 var y=Math.round(Math.random()*h);
 
img.style.left=x+"px";
img.style.top=y+"px";

//alert(img.style.top);
 setTimeout("floatimg()",700);
}
floatimg();
</script>

 

 

 

 

 

 

 

 

 

發佈了68 篇原創文章 · 獲贊 0 · 訪問量 4萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章