javascript實現小球的自由移動代碼

相關推薦

　　用javascript實現小球的自由移動是不是很神奇啊?下面小編交給大家實現的方法，歡迎閱讀以下代碼，更多詳情請關注應屆畢業生考試網。

　　代碼如下：

　　<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

　　<html>

　　<head>

　　<title>javascript實現小球的自由移動-www.javaweb.cc</title>

　　//定義全局變量

　　//小球坐標

　　ballX=0;

　　ballY=0;

　　//小球在x,y軸移動的方向

　　directX=1;

　　directY=1;

　　//小球移動

　　function ballMove(){

　　//小球移動

　　ballX+=2*directX;

　　ballY+=2*directY;

　　//同時修改小球的top 和width

　　p2.style.top=ballY+'px';

　　p2.style.left=ballX+'px';

　　//window.alert(p1.offsetWidth);

　　//offsetwidth在JS中是獲取元素的寬,對應的還有offsetHeight

　　//判斷轉向

　　//learInterval(i);

　　if(ballX+p2.offsetWidth>=p1.offsetWidth || ballX<=0){

　　directX=-directX;

　　}

　　if(ballY+p2.offsetHeight>=p1.offsetHeight || ballY<=0){

　　directY=-directY;

　　}

　　//定時器

　　var i=setInterval("ballMove()",10);

　　</script>

　　</head>

　　<body>

　　</p>

　　</body>

　　</html>

【javascript實現小球的自由移動代碼】相關文章：

JavaScript簡單實現放大鏡效果代碼09-24

Javascript實現全選并賦值給文本框代碼實例08-24

php動態生成JavaScript代碼10-03

JavaScript重置表單的實現09-23

PHP滾動日志的代碼實現11-15

Java 隊列實現原理及簡單實現代碼09-13

php實現無限級分類實現代碼07-03

JavaScript代碼的5個書寫壞習慣08-16

java利用反射實現動態代理實現代碼10-08