summaryrefslogtreecommitdiff
path: root/web/learn_canvas/canvas_btns/test.html
diff options
context:
space:
mode:
authorzhang <zch921005@126.com>2022-06-04 08:48:54 +0800
committerzhang <zch921005@126.com>2022-06-04 08:48:54 +0800
commit44097da7288042e988bcb89f1c6cc817a8e1eec9 (patch)
tree7c28da29f31ca429b8d27ed7441d650f1195812d /web/learn_canvas/canvas_btns/test.html
parent0f885b830ac552bfd357dec74c70e1349434b58b (diff)
0604
Diffstat (limited to 'web/learn_canvas/canvas_btns/test.html')
-rw-r--r--web/learn_canvas/canvas_btns/test.html77
1 files changed, 77 insertions, 0 deletions
diff --git a/web/learn_canvas/canvas_btns/test.html b/web/learn_canvas/canvas_btns/test.html
new file mode 100644
index 0000000..9de2318
--- /dev/null
+++ b/web/learn_canvas/canvas_btns/test.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Bouncing Balls</title>
+
+ <style>
+ body {
+ background: #dddddd;
+ }
+
+ #canvas {
+ margin-left: 10px;
+ margin-top: 10px;
+ background: #ffffff;
+ border: thin solid #aaaaaa;
+ }
+
+ #glasspane {
+ position: absolute;
+ left: 50px;
+ top: 50px;
+ padding: 0px 20px 10px 10px;
+ background: rgba(0, 0, 0, 0.3);
+ border: thin solid rgba(0, 0, 0, 0.6);
+ color:# #eeeeee;
+ font-family: Droid Sans, Arial, Helvetica, sans-serif;
+ font-size: 12px;
+ cursor: pointer;
+ -webkit-box-shadow: rgba(0,0,0,0.5) 5px 5px 20px;
+ -moz-box-shadow: rgba(0,0,0,0.5) 5px 5px 20px;
+ box-shadow: rgba(0,0,0,0.5) 5px 5px 20px;
+ }
+
+ #glasspane h2 {
+ font-weight: normal;
+ }
+
+ #glasspane .title {
+ font-size: 2em;
+ color:# rgba(255, 255, 0, 0.8);
+ }
+
+ #glasspane a:hover {
+ color:# yellow;
+ }
+
+ #glasspane a {
+ text-decoration: none;
+ color:# #cccccc;
+ font-size: 3.5em;
+ }
+
+ #glasspane p {
+ margin: 10px;
+ color:# rgba(65, 65, 220, 1.0);
+ font-size: 12pt;
+ font-family: Palatino, Arial, Helvetica, sans-serif;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div id='glasspane'>
+ <h2 class='title'>Bouncing Balls</h2>
+
+ <p>One hundred balls bouncing</p>
+
+ <a id='startButton'>Start</a>
+ </div>
+
+ <canvas id='canvas' width='750' height='500'>
+ Canvas not supported
+ </canvas>
+
+ <script src='example.js'></script>
+ </body>
+</html>