diff options
Diffstat (limited to 'Code/ZJW/Happy-Birthday.html')
| -rw-r--r-- | Code/ZJW/Happy-Birthday.html | 106 |
1 files changed, 106 insertions, 0 deletions
diff --git a/Code/ZJW/Happy-Birthday.html b/Code/ZJW/Happy-Birthday.html new file mode 100644 index 0000000..2036c2b --- /dev/null +++ b/Code/ZJW/Happy-Birthday.html | |||
| @@ -0,0 +1,106 @@ | |||
| 1 | F<!DOCTYPE HTML> | ||
| 2 | <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> | ||
| 3 | <head> | ||
| 4 | <title>Happy Birthday</title> | ||
| 5 | <meta http-equiv="content-type" content="text/html; charset=UTF-8"> | ||
| 6 | <style type="text/css"> | ||
| 7 | @font-face { | ||
| 8 | font-family: digit; | ||
| 9 | src: url('./fonts/digital-7_mono.ttf') format("truetype"); | ||
| 10 | } | ||
| 11 | </style> | ||
| 12 | <link href="stylesheets/default.css" type="text/css" rel="stylesheet"> | ||
| 13 | <script type="text/javascript" src="javascripts/jquery.js"></script> | ||
| 14 | <script type="text/javascript" src="javascripts/garden_dev.js"></script> | ||
| 15 | <script type="text/javascript" src="javascripts/functions_dev.js"></script> | ||
| 16 | </head> | ||
| 17 | |||
| 18 | <body> | ||
| 19 | <div id="mainDiv"> | ||
| 20 | <div id="content"> | ||
| 21 | <div id="code"> | ||
| 22 | <span class="comments"> </span><br /> | ||
| 23 | <span class="space"/><span class="comments"> </span><br /> | ||
| 24 | <span class="space"/><span class="comments"> </span><br /> | ||
| 25 | <span class="space"/><span class="comments"> </span><br /> | ||
| 26 | <span class="keyword"> </span> <span class="string"> </span> <br /> | ||
| 27 | <span class="comments"> </span><br /> | ||
| 28 | <span class="keyword"> </span> <br /> | ||
| 29 | <span class="keyword"> </span> <span class="string"> </span> <br /> | ||
| 30 | <br /> | ||
| 31 | <span class="string"> </span> </br> | ||
| 32 | </br> | ||
| 33 | </br> | ||
| 34 | <span class="comments"> </span><br /> | ||
| 35 | <span class="keyword"> </span> <br /> | ||
| 36 | </br> | ||
| 37 | <span class="comments"> </span><br /> | ||
| 38 | </br> | ||
| 39 | <span class="comments"> </span><br /> | ||
| 40 | </br> | ||
| 41 | <span class="comments"> </span><br /> | ||
| 42 | </br> | ||
| 43 | <span class="comments"> </span><br /> | ||
| 44 | </br> | ||
| 45 | <span class="comments"> </span><br /> | ||
| 46 | <span class="string"> </span> | ||
| 47 | </div> | ||
| 48 | <div id="loveHeart"> | ||
| 49 | <canvas id="garden"></canvas> | ||
| 50 | <div id="words"> | ||
| 51 | <div id="messages"> | ||
| 52 | </br> | ||
| 53 | </br> | ||
| 54 | </br> | ||
| 55 | </br> | ||
| 56 | |||
| 57 | <div id="elapseClock"></div> | ||
| 58 | </div> | ||
| 59 | <div id="loveu"> | ||
| 60 | |||
| 61 | <div class="signature"> </div> | ||
| 62 | </div> | ||
| 63 | </div> | ||
| 64 | </div> | ||
| 65 | </div> | ||
| 66 | <div id="copyright"> | ||
| 67 | <a href=" "> </a> <br /> | ||
| 68 | </br> | ||
| 69 | <a href=" "> </a> </br> | ||
| 70 | </div> | ||
| 71 | </div> | ||
| 72 | <script type="text/javascript"> | ||
| 73 | var offsetX = $("#loveHeart").width() / 2; | ||
| 74 | var offsetY = $("#loveHeart").height() / 2 - 55; | ||
| 75 | var together = new Date(); | ||
| 76 | together.setFullYear(1995,11, 30); | ||
| 77 | together.setHours(0); | ||
| 78 | together.setMinutes(0); | ||
| 79 | together.setSeconds(0); | ||
| 80 | together.setMilliseconds(0); | ||
| 81 | |||
| 82 | if (!document.createElement('canvas').getContext) { | ||
| 83 | var msg = document.createElement("div"); | ||
| 84 | msg.id = "errorMsg"; | ||
| 85 | msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+"; | ||
| 86 | document.body.appendChild(msg); | ||
| 87 | $("#code").css("display", "none") | ||
| 88 | $("#copyright").css("position", "absolute"); | ||
| 89 | $("#copyright").css("bottom", "10px"); | ||
| 90 | document.execCommand("stop"); | ||
| 91 | } else { | ||
| 92 | setTimeout(function () { | ||
| 93 | startHeartAnimation(); | ||
| 94 | }, 5000); | ||
| 95 | |||
| 96 | timeElapse(together); | ||
| 97 | setInterval(function () { | ||
| 98 | timeElapse(together); | ||
| 99 | }, 500); | ||
| 100 | |||
| 101 | adjustCodePosition(); | ||
| 102 | $("#code").typewriter(); | ||
| 103 | } | ||
| 104 | </script> | ||
| 105 | </body> | ||
| 106 | </html> | ||