实例介绍
【实例简介】
【实例截图】
【核心代码】
<!DOCTYPE HTML> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Our Love Story</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">/**</span><br /> <span class="space"/><span class="comments">* Valentine's Day is coming,</span><br /> <span class="space"/><span class="comments">* so I write some code to celebrate our love.</span><br /> <span class="space"/><span class="comments">*/</span><br /> Boy i = <span class="keyword">new</span> Boy(<span class="string">"Jinkai"</span>);<br /> Girl u = <span class="keyword">new</span> Girl(<span class="string">"Zhangqianling"</span>);<br /> <span class="comments">// 2015.1.30 22:07, I told you I love you. </span><br /> i.love(u);<br /> <span class="comments">// Luckily, you accepted and became my girlfriend eversince.</span><br /> u.accepted();<br /> <span class="comments">// Since then, I miss u every day.</span><br /> i.miss(u);<br /> <span class="comments">// And take care of u and our love.</span><br /> i.takeCareOf(u);<br /> <span class="comments">// You say that it won't be easy to love you.</span><br /> <span class="comments">// So I keep waiting and I have confidence that you will.</span><br /> <span class="comments">// Sometimes You think I am not care about you enough ,And I am sorry.</span><br /> <span class="comments">// The reason is that i want us to live better forever ,and i must work hard</span><br /> <span class="keyword">boolean</span> isHesitate = <span class="keyword">true</span>;<br /> <span class="keyword">while</span> (isHesitate) {<br /> <span class="placeholder"/>i.waitFor(u);<br/> <span class="placeholder"/><span class="comments">// I think it is an important decision</span><br /> <span class="placeholder"/><span class="comments">// and you should think it over.</span><br /> <span class="placeholder"/>isHesitate = u.thinkOver();<br /> }<br /> <span class="comments">// There will be a romantic wedding,and we will live happily ever after.</span><br /> i.marry(u);<br /> i.liveHappilyWith(u);<br /> <br /> </div> <div id="loveHeart"> <canvas id="garden"></canvas> <div id="words"> <div id="messages"> Qianling, I have fallen in love with you for <div id="elapseClock"></div> </div> <div id="loveu"> Love u forever and ever.<br/> <div class="signature">- JKXQJ</div> </div> </div> </div> </div> </div> <script type="text/javascript"> var offsetX = $("#loveHeart").width() / 2; var offsetY = $("#loveHeart").height() / 2 - 55; var together = new Date(); together.setFullYear(2014, 12, 30); together.setHours(22); together.setMinutes(07); 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(); }, 86000); timeElapse(together); setInterval(function () { timeElapse(together); }, 500); adjustCodePosition(); $("#code").typewriter(); } </script> </body> </html>
好例子网口号:伸出你的我的手 — 分享!
小贴士
感谢您为本站写下的评论,您的评论对其它用户来说具有重要的参考价值,所以请认真填写。
- 类似“顶”、“沙发”之类没有营养的文字,对勤劳贡献的楼主来说是令人沮丧的反馈信息。
- 相信您也不想看到一排文字/表情墙,所以请不要反馈意义不大的重复字符,也请尽量不要纯表情的回复。
- 提问之前请再仔细看一遍楼主的说明,或许是您遗漏了。
- 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦,又没人会搭理,于人于己都无利。
关于好例子网
本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享,对搜索内容的合法性不具有预见性、识别性、控制性,仅供学习研究,请务必在下载后24小时内给予删除,不得用于其他任何用途,否则后果自负。基于互联网的特殊性,平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查;无论平台是否已进行审查,用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场,基于网友分享,根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定,若资源存在侵权或相关问题请联系本站客服人员,点此联系我们。关于更多版权及免责申明参见 版权及免责申明
网友评论
我要评论