熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

js 圖片隨機不定向浮動的實現代碼

2013-11-15 12:02:05  來源: JSP教程 
這篇文章介紹了js圖片隨機不定向浮動的實現代碼有需要的朋友可以參考一下   復制代碼 代碼如下:

  
//很有趣的浮動哦不用太多代碼和大家分享下
<html>
<head>隨機浮動
<style type="text/css">
#divimg{
/*
對圖片進行絕對定位
*/
position:absolute;
}
</style>
</head>
<body>
<div id="divimg">
<img src="//resource/images/floatjpg" width="" height="">
</div>
<script language="javascript" type="text/javascript">
//獲取圖片的所有div對象
var divimg=documentgetElementById("divimg");
//設置起始位置
var x=y=;
//設置圖片的前進速度
var xSpeed=ySpeed=;
//設置圖片浮動高度和寬度
var w=documentdocumentElementclientWidthh=documentbodyclientHeight;
//alert(w);
function floatimg(){
//比較是否達到邊界如果到達邊界以後就改變圖片的方向為反向如果未達到邊界則繼續向前
if(x<||x>w) xSpeed=xSpeed;
if(y<||y>h) ySpeed=ySpeed;
x+=xSpeed;
y+=ySpeed;
setTimeout("floatimg()");
var n=divimgstyletop=Mathround(Mathrandom()*h)+"px";
var m=divimgstyleleft=Mathround(Mathrandom()*w)+"px";
}
floatimg();
</script>
</body>
</html>


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20126.html
    推薦文章
    Copyright © 2005-2013 電腦知識網 Computer Knowledge   All rights reserved.