Sometimes user interactive web fluff is useful for holding a visitors attention on a site,
so here is a little HTML5 canvas demo to create random numbered lottery balls that bounce around a bit.
The basic page code is below and the three external javascript files can be downloaded here
there's two online demos there as well, one in page and the other is embedable for webmasters or bloggers who don't code. All the tweekable settings are in the file Main.js that control ball size, colours and all the randomness.
Have fun with it!
<!DOCTYPE html>
<html><head>
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Freebie Lotto Number Picker</title>
<style>
body {
overflow: hidden;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.balltext{
font-size:40px;
color:#000000;
font-weight: bold;
}
#canvas {
height: 350px;
width: 468px;
background-repeat: no-repeat;<br />
z-index: 2;
}
#Layer1{
width:468px;
height:60px;
}
</style>
</head>
<body>
<div id="canvas">
</div>
<script src="protoclass.js"></script><br />
<script src="box2d.js"></script><br />
<script src="Main.js"></script><br />
</body></html>