程序员情人节生日表白源码合集总有一款能够打动她（附带烟花特效，520爱心）

文档中心

情人节少不了送花送礼物，作为一个程序员，当然不会在送什么礼物上给你指点一二，但可以发挥自己的优势，但是可以通过制作网站的方式打动她，下面给大家推荐几个经典表白网站示例，下载源码简单修改文字即可。

1，唯美表白网页

2，烂漫爱心表白动画(程序员也是很烂漫的)

3，情人节表白放烟花动画特效

4，520爱心背景表白网页

5，卡通短片七夕情人节送花动画场景

6，love场景式表白

....

持续更新中

运行效果截图（唯美表白网页）

代码示例

jQuery+Html5实现唯美表白动画代码                  本页面采用HTML5编辑，目前您的浏览器无法显示，请换成谷歌(Chrome)或者火狐(Firefox)浏览器，或者其他游览器的最新版本。
                 我爱你，虽然你看不见我对你的告白
 
 我知道我不会甜言蜜语，但是我会用行动证明一切
 
  你说我啰嗦，有些东西因为越在乎所以越失去
因为我太爱你了，所以我失去你了
因为我太啰嗦了，所以你离开了我
 虽然你看不见我的告白，但是我还是要把这些心里话说出来
 
    -- 爱你的老公--  
      
  
        我喜欢你已经是……    
       
      
             (function(){ var canvas = $('#canvas'); if (!canvas[0].getContext) {     $("#error").show();     return false; } var width = canvas.width(); var height = canvas.height();  canvas.attr("width", width); canvas.attr("height", height); var opts = {     seed: {  x: width / 2 - 20,  color: "rgb(190, 26, 37)",  scale: 2     },     branch: [  [535, 680, 570, 250, 500, 200, 30, 100, [      [540, 500, 455, 417, 340, 400, 13, 100, [   [450, 435, 434, 430, 394, 395, 2, 40]      ]],      [550, 445, 600, 356, 680, 345, 12, 100, [   [578, 400, 648, 409, 661, 426, 3, 80]      ]],      [539, 281, 537, 248, 534, 217, 3, 40],      [546, 397, 413, 247, 328, 244, 9, 80, [   [427, 286, 383, 253, 371, 205, 2, 40],   [498, 345, 435, 315, 395, 330, 4, 60]      ]],      [546, 357, 608, 252, 678, 221, 6, 100, [   [590, 293, 646, 277, 648, 271, 2, 80]      ]]  ]]      ],     bloom: {  num: 700,  width: 1080,  height: 650,     },     footer: {  width: 1200,  height: 5,  speed: 10,     } } var tree = new Tree(canvas[0], width, height, opts); var seed = tree.seed; var foot = tree.footer; var hold = 1; canvas.click(function(e) {     var offset = canvas.offset(), x, y;     x = e.pageX - offset.left;     y = e.pageY - offset.top;     if (seed.hover(x, y)) {  hold = 0;   canvas.unbind("click");  canvas.unbind("mousemove");  canvas.removeClass('hand');     } }).mousemove(function(e){     var offset = canvas.offset(), x, y;     x = e.pageX - offset.left;     y = e.pageY - offset.top;     canvas.toggleClass('hand', seed.hover(x, y)); }); var seedAnimate = eval(Jscex.compile("async", function () {     seed.draw();     while (hold) {  $await(Jscex.Async.sleep(10));     }     while (seed.canScale()) {  seed.scale(0.95);  $await(Jscex.Async.sleep(10));     }     while (seed.canMove()) {  seed.move(0, 2);  foot.draw();  $await(Jscex.Async.sleep(10));     } })); var growAnimate = eval(Jscex.compile("async", function () {     do {     tree.grow();  $await(Jscex.Async.sleep(10));     } while (tree.canGrow()); })); var flowAnimate = eval(Jscex.compile("async", function () {     do {     tree.flower(2);  $await(Jscex.Async.sleep(10));     } while (tree.canFlower()); })); var moveAnimate = eval(Jscex.compile("async", function () {     tree.snapshot("p1", 240, 0, 610, 680);     while (tree.move("p1", 500, 0)) {  foot.draw();  $await(Jscex.Async.sleep(10));     }     foot.draw();     tree.snapshot("p2", 500, 0, 610, 680);     // 会有闪烁不得意这样做, (＞﹏＜)     canvas.parent().css("background", "url(" + tree.toDataURL('image/png') + ")");     canvas.css("background", "#ffe");     $await(Jscex.Async.sleep(300));     canvas.css("background", "none"); })); var jumpAnimate = eval(Jscex.compile("async", function () {     var ctx = tree.ctx;     while (true) {  tree.ctx.clearRect(0, 0, width, height);  tree.jump();  foot.draw();  $await(Jscex.Async.sleep(25));     } })); var textAnimate = eval(Jscex.compile("async", function () {    var together = new Date();    together.setFullYear(2016,3 , 15); //时间年月日    together.setHours(16);//小时    together.setMinutes(53);//分钟    together.setSeconds(0);//秒前一位    together.setMilliseconds(2);//秒第二位    $("#code").show().typewriter();     $("#clock-box").fadeIn(500);     while (true) {  timeElapse(together);  $await(Jscex.Async.sleep(1000));     } })); var runAsync = eval(Jscex.compile("async", function () {     $await(seedAnimate());     $await(growAnimate());     $await(flowAnimate());     $await(moveAnimate());     textAnimate().start();     $await(jumpAnimate()); })); runAsync().start();    })();

运行截图

代码示例（烂漫爱心表白动画(程序员也是很烂漫的)）

Our Love Story@font-face {font-family: digit;src: url('digital-7_mono.ttf') format("truetype");}/**
*2013—02-14,
*2013-02-28.
*/
Boy name = Mr LI
Girl name = Mrs ZHANG
// Fall in love river. 
The boy love the girl;
// They love each other.
The girl loved the boy;
// AS time goes on.
The boy can not be separated the girl;
// At the same time.
The girl can not be separated the boy;
// Both wind and snow all over the sky.
// Whether on foot or 5 kilometers.
The boy very happy;
The girl is also very happy;
// Whether it is right now
// Still in the distant future.
The boy has but one dream;
// The boy wants the girl could well have been happy.


I want to say:
Baby, I love you forever;
亲爱的，这是我们相爱在一起的时光。
爱你直到永永远远。
- 李先生
....
....
var offsetX = $("#loveHeart").width() / 2;var offsetY = $("#loveHeart").height() / 2 - 55;var together = new Date();together.setFullYear(2013, 2, 28);together.setHours(20);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!
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();}

运行截图（情人节表白放烟花动画特效）

jQuery情人节表白放烟花动画特效*{ -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-box-sizing: border-box; box-sizing: border-box; }html{ width: 100%; height: 100%; }body{ max-width: 600px; margin: 0 auto; background: #0b3443; color: #f0f0f0;}.share_img{ width: 0; height: 0; overflow: hidden; opacity: 0; }.content{ padding: 80px 20px;}.text_wrapper{ display: -webkit-box; display: flex; }.text_wrapper .text{ padding-top: 20px; padding-left: 20px; }.hide{ display: none !important; }p{ margin: 0; }.btn-groups{ padding-right: 20px; text-align: center; }.heart-btn{ display: inline-block; animation: breath 0.8s linear 0s infinite both; -webkit-animation: breath 0.8s linear 0s infinite both; }.btn{ position: relative; display: inline-block; width: 60px; height: 60px; margin: 0 30px; transform: rotate(45deg); -webkit-transform: rotate(45deg);}.btn span{ display: block; width: 100%; height: 100%; line-height: 60px; margin-top: -10px; margin-left: -10px; text-align: center; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }.btn-a{ background: #d26ae5; }.btn-b{ background: #c9c9c9; }.btn-a:before{ content: ''; position: absolute; display: block; width: 30px; height: 60px; background: #d26ae5; left: -29px; top: 0; border-top-left-radius: 60px; border-bottom-left-radius: 60px; }.btn-a:after{ content: ''; position: absolute; display: block; width: 60px; height: 30px; background: #d26ae5; left: 0; top: -29px; border-top-left-radius: 60px; border-top-right-radius: 60px;}.btn-b:before{ content: ''; position: absolute; display: block; width: 30px; height: 60px; background: #c9c9c9; left: -29px; top: 0; border-top-left-radius: 60px; border-bottom-left-radius: 60px; }.btn-b:after{ content: ''; position: absolute; display: block; width: 60px; height: 30px; background: #c9c9c9; left: 0; top: -29px; border-top-left-radius: 60px; border-top-right-radius: 60px;}.container{  }.container .mask{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.3); }.container .modal{ width: 80%; height: 160px; position: absolute; top: 50%; left: 50%; padding: 20px 15px; border-radius: 5px; transform: translate(-50%, -70%); -webkit-transform: translate(-50%，-70%); background: #f3f3f3;}.container .modal p{ margin-top: 20px; margin-bottom: 20px; font-size: 16px; color: #353535; text-align: center;}.confirm{ display: block; width: 120px; height: 40px; margin: 0 auto; border: none; font-size: 16px; border-radius: 5px; color: #ffffff; background: #f45cae; }.type_words{ padding: 12px 20px; }@keyframes breath {0% {transform: scale3d(1,1,1);-webkit-transform: scale3d(1,1,1);transform-origin: 50% 50%;}50%{transform: scale3d(1.02,1.02,1.02);-webkit-transform: scale3d(1.02,1.02,1.02);transform-origin: 50% 50%;}100%{transform: scale3d(1,1,1);-webkit-transform: scale3d(1,1,1);transform-origin: 50% 50%;}}$(function() {$('#yes').click(function(event) {modal('我就知道小姐姐您一定会愿意的。(^_^)', function() {$('.page_one').addClass('hide');$('.page_two').removeClass('hide');// typeWrite();fireworks();});});$('#no').click(function(event) {modal('明人不说暗话！', A);});});function A() {modal('我喜欢你！', B);}function B() {modal('我知道你在等我这一句话', C);}function C() {modal('请您不要拒绝我', D);}function D() {modal('拒绝我，不存在的', E);}function E() {modal('这辈子都不可能让你离开我', F);}function F() {modal('跟我走吧', G);}function G() {modal('房产证上写你名', H);}function H() {modal('我会做饭', I);}function I() {modal('爱你。么么哒！', J)}function J() {modal('行，我们去民政局登记吧', function() {fireworks();});}function fireworks() {$('.page_one').addClass('hide');$('.page_two').removeClass('hide');$('.page_two').fireworks({   sound: false,   opacity: 0.9,   width: '100%',   height: '100%' });}function modal(content, callback) {var tpl = ''+'
'+''+''+ content +'
'+''+'
'+'
';$('body').append(tpl);$(document).on('click', '.confirm', function() {$('.container').remove();callback();});}var myWords = '有人说，人的一生会遇到2920万人，而两个人相爱的概率只有0.000049。在这茫茫人海中，两个人能相遇就值得感激，能相爱更是一种难得。所以，我很庆幸上天让我遇见了你。我希望有个如你一般的人，能看完我写过的所有状态，读完我所有的日志，看完我从小到大的照片，试着听我喜欢的歌。如果可以，甚至陪我去我喜欢的地方，只想弥补错过你的青春。';var x = 0;var speed = 150;var current = 0;function typeWrite(){$('.type_words').html(myWords.substring(0, x++)+'_');var timer = setTimeout("typeWrite()", speed);if (x == myWords.length) {x = myWords.length;clearTimeout(timer)}}
小姐姐，我好喜欢你，你愿意做我女朋友吗？
愿意
不愿意

效果截图（love场景式表白）

代码示例

<!--XXX LOVE XXXXX ❤ XX 一生一世
按键盘 "↓" 开始倾听工科男的浪漫表白
过去的XX一直是一个人生活，享受着孤独，也憧憬着爱情。
一个人的长廊
一个人的山岗
一个人的地铁
一个人的游乐场
但他依然乐观，微笑着，等待着
生活难免有风风雨雨
他总是能够轻松的应对
并且面带阳光、自信的笑容
生活也不会总是一帆风顺
但他每次都能勇敢的面对
随时准备接受生活的挑战
可是XX的爱情又在哪里呢？
在镜子里面吗？他不敢相信
他去问大树，我的爱情在哪里？
大树告诉他，也许就在不远的地方
于是，XX一个人继续向前走
走在茫茫的雪地上
直到有一天XX与XX相遇了
XX喜欢XX，非常非常的喜欢，因为XX的出现，XX脸上有了更加灿烂的笑容
可是XX会喜欢XX吗？
XX想。。。
XX想和XX在一起
然后XX会经常去找XX
然后两个人一起出去玩
晚上XX会把XX送回家
直到很晚
XX再一个人回家
然后高兴地进入梦乡，在梦中还会和XX在一起
XX想成为了XX的逛街助手
然后，XX和XX一起去很多地方玩
XX也想和XX一块成为一对吃货
再然后，他们会搬到了一起
再然后，XX会开始学习她的技能
煮饭
那时候，每天早上，他们吃着自己做的美食
然后在同一个站台，高高兴兴的一起上班
XX会感觉自己好幸福。
因为自己有了家
那个有XX在的地方
他们可能偶尔也会吵架
XX不想这样
一定是我有什么做的不对，XX会这么想
如果没有XX在身边，窗外就没有风景
如果没有XX在身后
 XX又怎会飞的更高更远
XX不想这样。他要为XX改变自己
XX不知道XX喜欢什么，但他一定会满足她的一切。
我愿意一直陪伴着你
爱情就像花草一样
需要用包容来浇灌
直到一天，XX不想让自己后悔
XX开始准备一份惊喜
看着惊喜一点点准备好了XX好开心因为他想象着XX看到时开心的样子
想想未来他们或许      会有一辈子XX好开心或许他可以和XX一起去全世界好多地方玩
XX也会继续努力
为了他和XX的梦之城堡
XX很幸福，因为他遇到了XX。他相信后面的每天都会是快乐的
简简单单，体会与XX在一起的每一个刻
XX想和XX一起过幸福的生活
永远有多远？
比时间多一秒就是永远，我会永远爱你
世界有多大？
你走到哪里，世界就有多大
如果三年后你注定是我女朋友，你何不提早行使你的权利
我爱你
I love you
我相信，XX和XX的故事会一直继续下去。
无论精彩、平淡都会是他们喜欢的。
      XXX，我爱你


 -- 按“Esc"键有惊喜
您的浏览器禁用了javascript，无法正常浏览本页面

运行效果（卡通短片七夕情人节送花动画场景）

最后也祝愿各位同学能够表白成功。

源码获取：关注 "java后端技术精选" 回复【表白】

程序员情人节生日表白源码合集总有一款能够打动她（附带烟花特效，520爱心）

运行效果截图（唯美表白网页）

运行截图

代码示例 （烂漫爱心表白动画(程序员也是很烂漫的)）

运行截图（情人节表白放烟花动画特效）

效果截图（love场景式表白）

代码示例

一个人的长廊

一个人的山岗

一个人的地铁

一个人的游乐场

但他依然乐观，微笑着，等待着

生活难免有风风雨雨

他总是能够轻松的应对

并且面带阳光、自信的笑容

生活也不会总是一帆风顺

但他每次都能勇敢的面对随时准备接受生活的挑战

可是XX的爱情又在哪里呢？

在镜子里面吗？他不敢相信

他去问大树，我的爱情在哪里？大树告诉他，也许就在不远的地方

于是，XX一个人继续向前走走在茫茫的雪地上

直到有一天XX与XX相遇了

可是XX会喜欢XX吗？

XX想。。。

XX想和XX在一起

然后XX会经常去找XX

然后两个人一起出去玩

晚上XX会把XX送回家

直到很晚XX再一个人回家

然后高兴地进入梦乡，在梦中还会和XX在一起

XX想成为了XX的逛街助手

然后，XX和XX一起去很多地方玩

XX也想和XX一块成为一对吃货

再然后，他们会搬到了一起

再然后，XX会开始学习她的技能

煮饭

那时候，每天早上，他们吃着自己做的美食

然后在同一个站台，高高兴兴的一起上班

XX会感觉自己好幸福。因为自己有了家那个有XX在的地方

他们可能偶尔也会吵架

XX不想这样

一定是我有什么做的不对，XX会这么想

如果没有XX在身边，窗外就没有风景

如果没有XX在身后

XX又怎会飞的更高更远

XX不想这样。他要为XX改变自己XX不知道XX喜欢什么，但他一定会满足她的一切。

我愿意一直陪伴着你

爱情就像花草一样需要用包容来浇灌

直到一天，XX不想让自己后悔XX开始准备一份惊喜

看着惊喜一点点准备好了XX好开心因为他想象着XX看到时开心的样子

想想未来他们或许 会有一辈子XX好开心或许他可以和XX一起去全世界好多地方玩

如果三年后你注定是我女朋友，你何不提早行使你的权利

我爱你

运行效果（卡通短片七夕情人节送花动画场景）

相关问题

公告

标签

代码示例（烂漫爱心表白动画(程序员也是很烂漫的)）

但他每次都能勇敢的面对
随时准备接受生活的挑战

他去问大树，我的爱情在哪里？
大树告诉他，也许就在不远的地方

于是，XX一个人继续向前走
走在茫茫的雪地上

直到很晚
XX再一个人回家

XX会感觉自己好幸福。
因为自己有了家
那个有XX在的地方

XX不想这样。他要为XX改变自己
XX不知道XX喜欢什么，但他一定会满足她的一切。

爱情就像花草一样
需要用包容来浇灌

直到一天，XX不想让自己后悔
XX开始准备一份惊喜

想想未来他们或许会有一辈子XX好开心或许他可以和XX一起去全世界好多地方玩