替代Flash技术最好的选择------HTML5(5)
- UID
- 1066743
|
替代Flash技术最好的选择------HTML5(5)
5、代码示例
<script>
var canvas = document.getElementsByTagName('canvas')[0];
var context = canvas.getContext("2d");
function myCanvas() {
var r = Math.floor(Math.random()*256);
var g = Math.floor(Math.random()*256);
var b = Math.floor(Math.random()*256);
const WIDTH = canvas.width;
const HEIGHT = canvas.height;
var x = Math.random()*WIDTH;
var y = Math.random()*HEIGHT;
var width = Math.random()*WIDTH;
var height = Math.random()*HEIGHT;
//让图形生成在canvas里
if((x+width)>=WIDTH){
//重新生成
x = Math.random()*WIDTH;
width = Math.random()*WIDTH;
}
if((y+height)>=height){
y = Math.random()*height;
height = Math.random()*height;
}
context.strokeStyle = "rgb("+r+","+g+","+b+")";
context.strokeRect(x,y,width,height);
}
setInterval(myCanvas,1000);
</script>
6、运行结果
|
|
|
|
|
|