<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>宝贝映映 生日快乐</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
@font-face {
font-family: digit;
src: url('digital-7_mono.ttf') format("truetype");
}
</style>
<link href="css/default.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/garden.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
</head>
<body>
<div id="mainDiv">
<div id="content">
<div id="code">
<span class="comments">7月7日,终于等到今天了</span>
<br />
<span class="comments">盼了好久,真的好想陪你过生日</span>
<br />
<span class="comments">不知不觉,9个月了呢</span>
<br />
<span class="comments">还记得吗</span>
<br />
<span class="comments">以前你总是叫我小孩</span>
<br />
<span class="comments">可是现在不同了</span>
<br />
<span class="comments">我改掉了脾气</span>
<br />
<span class="comments">我对感情</span>
<br />
<span class="comments">不再冷漠</span>
<br />
<span class="comments">不再那么理性</span>
<br />
<span class="comments">我懂得了怎么去宠爱一个人</span>
<br />
<span class="comments">我不再是小孩了</span>
<br />
<span class="comments">我很坚定</span>
<br />
<span class="comments">也很珍惜</span>
<br />
<span class="comments">一直想给我们以后留下点什么回忆</span>
<br />
<span class="comments">这次终于动手做了</span>
<br />
<span class="comments">这个网页会永远运行下去</span>
<br />
<span class="comments">这只是一个开始</span>
<br />
<span class="comments">以后我们的点滴,我会一点一点记录在后面</span>
<br />
<span class="comments">宝贝</span>
<br />
<span class="comments">这辈子</span>
<br />
<span class="comments">遇上你</span>
<br />
<span class="comments">我没有遗憾了</span>
<br />
<span class="comments">这是我陪你过的第一个生日</span>
<br />
<span class="comments">以后每年这一天</span>
<br />
<span class="comments">我都会在</span>
<br />
<span class="comments">亲爱的:</span>
<br />
<span class="comments">生日快乐!</span>
<br />
</div>
<div id="loveHeart">
<canvas id="garden"></canvas>
<div id="words">
<div id="messages">
老婆,这已经是我们在一起的第
<div id="elapseClock"></div>
</div>
<div id="loveu">
Happy Birthday!
<br/>Love you forever and ever.
<div class="signature">- Ace</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
// let audio = document.querySelector('audio')
// audio.play()
var offsetX = $("#loveHeart").width() / 2;
var offsetY = $("#loveHeart").height() / 2 - 55;
var together = new Date();
together.setFullYear(2011, 9, 7);
together.setHours(0);
together.setMinutes(0);
together.setSeconds(0);
together.setMilliseconds(0);
if (!document.createElement('canvas').getContext) {
var msg = document.createElement("div");
msg.id = "errorMsg";
msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+";
document.body.appendChild(msg);
$("#code").css("display", "none")
$("#copyright").css("position", "absolute");
$("#copyright").css("bottom", "10px");
document.execCommand("stop");
} else {
setTimeout(function () {
startHeartAnimation();
}, 5000);
timeElapse(together);
setInterval(function () {
timeElapse(together);
}, 500);
adjustCodePosition();
$("#code").typewriter();
}
</script>
<audio src="qingge.mp3"/>
<script>
let audio = document.querySelector('audio')
let a = 0
document.body.addEventListener('click',function(){
if(a == 0){
audio.play()
a = 1
}else{
audio.pause()
a = 0
}
})
</script>
</body>
</html>