diff options
| author | Felipe Lopez Toledo <zer.subzero@gmail.com> | 2009-08-25 20:17:36 (GMT) |
|---|---|---|
| committer | Felipe Lopez Toledo <zer.subzero@gmail.com> | 2009-08-25 20:17:36 (GMT) |
| commit | 05c13d716040a5b7d0031de1c606219fc12b5d6f (patch) | |
| tree | 0aad07077a49f17b060fb9daa5604f527f12bc81 | |
| parent | cd45dbe78efb20663ba586e92c9c69359cceb9b5 (diff) | |
mytest.html added to master branch
| -rw-r--r-- | examples/adding_up_to_10/mytest.html | 116 |
1 files changed, 116 insertions, 0 deletions
diff --git a/examples/adding_up_to_10/mytest.html b/examples/adding_up_to_10/mytest.html new file mode 100644 index 0000000..a3c922b --- /dev/null +++ b/examples/adding_up_to_10/mytest.html @@ -0,0 +1,116 @@ +<html lang="en"> + +<head> + <title>Karma - Adding Up to 10</title> + <meta name="keywords" content="karma,javascript,html5,sugar,sugarlabs,gsoc,ole,nepal"/> + + + + <style type="text/css"> + #main { + float: left; + width: 68%; + height: 90%; + border: 2px solid black; + } + + #mainTop { + width: 100%; + height: 90%; + border: 2px solid black; + } + + #mainTopCanvas { + width: 20%; + height: 100%; + border: 2px solid black; + } + + #mainBottom { + width: 100%; + height: 40%; + border: 2px solid black; + } + + #aside { + float: right; + width: 28%; + height: 90%; + border: 2px solid blue; + } + + #asideCanvas { + width: 40%; + height: 30%; + border: 2px solid black; + } + + #mainBottomCanvas { + width: 60%; + height: 30%; + border: 2px solid black; + } + + + </style> + +<script type="text/javascript"> + window.addEventListener('load', function() { + var mainTopCanvas = document.getElementById('mainTopCanvas'); + var mainBottomCanvas = document.getElementById('mainBottomCanvas'); + var asideCanvas = document.getElementById('asideCanvas'); + + var tcCtx = mainTopCanvas.getContext('2d'); + var bcCtx = mainBottomCanvas.getContext('2d'); + var acCtx = asideCanvas.getContext('2d'); + var startY = 0; + + +// tcCtx.fillRect(0,0,30,30); + + bcCtx.fillRect(20, 30, 50, 90); + + var timerFn = function () { + if (startY !== 0) { + tcCtx.clearRect(0, startY - 10,300,10); + } + tcCtx.fillRect(0, startY,300,10); + startY = startY + 10; + + }; + + var id = setInterval (timerFn, 1000); + + + + }, false); + + +</script> + + + + +</head> + +<body> +<div> +<div id="main"> +<div id="mainTop"> +<canvas id="mainTopCanvas"></canvas> +</div> +<div id="mainBottom"> +<canvas id="mainBottomCanvas"></canvas> + +</div> + +</div> +<div id="aside"> +<canvas id="asideCanvas"></canvas> +</div> + + +</div> +</body> + +</html>
\ No newline at end of file |