说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

圣诞节快乐:来自程序员们的问候

HTML文档下载 WORD文档下载 PDF文档下载
转眼间,一年一度的圣诞节又来临了。在这个越来越受到国人重视的节日中,每个人有每个人的浪漫方式,当然程序员们也不例外。来看看程序员们是如何为这个节日增添不一样的气氛的。

转眼间,一年一度的圣诞节又来临了。在这个越来越受到国人重视的节日中,每个人有每个人的浪漫方式,当然程序员们也不例外。

下面就来看看一些IT企业和程序员们是如何为这个节日增添不一样的气氛的。

一、来自IT巨头的问候

1.  Google的彩蛋

每到节日,Google就会在其搜索引擎中加入一些彩蛋,在用户搜索特定关键词的时候出现特殊的页面效果。临近圣诞,当用户在Google中输入“圣诞节”时,会页面上端出现飘雪的场景和圣诞老人驾驶鹿车飞驰的画面。


2.  百度的小游戏

当用户在百度中搜索“圣诞节”时,就会出现一个小游戏。该游戏基于HTML5制作。


详细信息可查看这个页面的源码。http://www.baidu.com/ur/show/uhchristmas?from=christmasresult

3.  微软追踪圣诞老人网站

微软今年推出了一个追踪圣诞老人的网站,该主题网站基于Html5和WebGL技术,首页有圣诞节的倒计时,此外还有许多好玩的在线游戏,最主要的是该网站在触摸设备上也有很好的体验。


网站地址:http://www.noradsanta.org/

二、来自初级程序员的问候

如果你刚开始学习HTML5,你可以制作一些简单的效果来庆祝圣诞节。

1.  使用canvas功能绘制的简单圣诞树

在绘图板中绘制下面这个图形并不算什么难事,但是使用代码来生成这个圣诞树却需要一定的HTML5基础。

下面这个图形使用HTML5中的<canvas>标签来绘制,如果你熟悉HTML5,这对你来说轻而易举。


源码:http://www.spjeff.com/2013/12/05/christmas-tree-html5-js-and-css3/

2. 雪花效果

jQuery的出现,让各种动画效果变得更加容易。比如,你可以通过jQuery、jQuery.snow.js插件以及少量的代码,就可以让页面中飘舞这雪花。


源码:https://github.com/tzach/merry-christmas

3.  一个非常漂亮的圣诞贺卡

该贺卡通过Construct2制作,然后通过c2runtime.js使得该贺卡可以直接在网页中运行。Construct2是一款用来制作HTML5应用的软件,拥有一个清晰直观、支持“拖拽”操作的开发环境,即使你没有任何编程经验也能开发自己的HTML5应用。


演示:http://3.s3.envato.com/files/72733144/blue/index.html

三、来自中级程序员的问候

随着编程技能的进一步掌握,你可以使用稍复杂的技术来实现一些更绚丽的效果。

1. CSS3实现圣诞树动画

该动画主要使用CSS3实现各种转场效果,并使用了HTML5中的<audio>标签来播放音频文件。同时还使用了StyleFix和PrefixFree脚本,这样在编写代码时可以不用为特定的CSS3属性添加浏览器前缀,也可以在其他浏览器中播放。


演示:http://christmasexperiments.com/2013/11/experiment.html

源码:https://github.com/podrivo/christmas

2. HTML表单元素制作的圣诞树

下面这个圣诞树没有采用松树的形式,而是采用了HTML表单元素来制作,比如输入框、单选钮,进度条,按钮等。


演示:http://hakim.se/experiments/css/domtree/

源码:https://github.com/hakimel/DOM-Tree

3. 3D雪花效果

该效果使用HTML5的<canvas>标签和three.js实现了3D的雪花飞舞效果。你可以拖动鼠标进行旋转。


演示:http://seb.ly/demos/JSSnowNew/snow3d.html

源码:https://github.com/sebleedelisle/live-coding-presentations/tree/master/2011/JSSnow

四、来自高级程序员的问候

1.  代码不到1KB的3D圣诞树

下面这个3D圣诞树只用1021字节的JavaScript代码编写而成,逼真的3D及旋转效果,将JavaScript功能发挥到了极致。


演示:http://js1k.com/2010-xmas/demo/856

源码如下:

M=Math;Q=M.random;J=[];U=16;T=M.sin;E=M.sqrt;for(O=k=0;x=z=j=i=k<200;)with(M[k]=k?c.cloneNode(0):c){width=height=k?32:W=446;with(getContext('2d'))if(k>10|!k)for(font='60px Impact',V='rgba(';I=i*U,fillStyle=k?k==13?V+'205,205,215,.15)':V+(147+I)+','+(k%2?128+I:0)+','+I+',.5)':'#cca',i<7;)beginPath(fill(arc(U-i/3,24-i/2,k==13?4-(i++)/2:8-i++,0,M.PI*2,1)));else for(;x=T(i),y=Q()*2-1,D=x*x+y*y,B=E(D-x/.9-1.5*y+1),R=67*(B+1)*(L=k/9+.8)>>1,i++<W;)if(D<1)beginPath(strokeStyle=V+R+','+(R+B*L>>0)+',40,.1)'),moveTo(U+x*8,U+y*8),lineTo(U+x*U,U+y*U),stroke();for(y=H=k+E(k++)*25,R=Q()*W;P=3,j<H;)J[O++]=[x+=T(R)*P+Q()*6-3,y+=Q()*U-8,z+=T(R-11)*P+Q()*6-3,j/H*20+((j+=U)>H&Q()>.8?Q(P=9)*4:0)>>1]}setInterval(function G(m,l){A=T(D-11);if(l)return(m[2]-l[2])*A+(l[0]-m[0])*T(D);a.clearRect(0,0,W,W);J.sort(G);for(i=0;L=J[i++];a.drawImage(M[L[3]+1],207+L[0]*A+L[2]*T(D)>>0,L[1]>>1)){if(i==2e3)a.fillText('Merry Christmas!',U,345);if(!(i%7))a.drawImage(M[13],((157*(i*i)+T(D*5+i*i)*5)%W)>>0,((113*i+(D*i)/60)%(290+i/99))>>0);}D+=.02},1)

2.  代码不到1KB的雪景效果

下面这个场景也是由不到1KB的JavaScript代码生成。


演示:http://js1k.com/2010-xmas/demo/855

源码如下:

for(p in a)a[p[0]+(p[6]||'')]=a[p];var M=Math,C=M.cos,S=M.sin,R=M.random,T=0,x=[],y=[],W=innerWidth,H=innerHeight,L=2047,Z=100,V=20,N=511,M=1337;c.width=W,b.style.overflow='hidden',b.style.margin='0px',c.height=H;g='globalAlpha';h='fillStyle';for(i=N;i--;){x[i]=L*R();y[i]=L*R()}setInterval(function(){T+=1/V;a[g]=0.2;function m(c){a[h]=c}m('#002');a.fc(0,0,W,H);a[g]=1;u=1;m('#ffc');for(i=0;i<N/3;++i){d=u=(u*M+1)&L;u=(u*M+1)&L;if(C(T*Z+i)<0.5){a.fx("\u2605",d,u)}}a.ba();a.arc(2*W/3,H/3,40,0,6.3,1);a.ca();a.fill();m('#cfc');B=H-V;for(j=0;j<5;++j){s=90-j*V;a.font=s+"px serif";F=1;for(i=0;i<W;i+=(F=(F*M)%Z)){a.fx("\u25B2",i-s/2,B+S(i)*30);}B-=s/2;}m('#eef');for(i=N;i--;){e=x[i];f=y[i];a.fx("\u06DE",e,f);y[i]=(f+1)%L;x[i]=(e+C(i+T)/3)%L}for(i=N*3;i--;){a.fc((x[i&N]+i)&L,(y[i&N]+i)&L,1,1)}for(i=W;i--;){d =Z+V*S(i/Z)+S(i/10);a.fc(i,H-d,1,d)}},50);

此外还有很多1KB代码编写的圣诞效果,大家可以访问js1k圣诞主页面

3.  游戏般的3D雪地场景

整个Demo是基于一个无限开阔的雪地场景的,里面有圣诞树和雪人,可以像玩FPS游戏一样在里面走动,WASD操控移动,按住鼠标左键拖拽控制方向,整个Demo是使用Oak3D框架制作的。


演示地址:http://christmas.oak3d.com/Scene/MerryChristmas.html

五、自己动手

看完上面的这些效果,你是不是也想自己动手做一个属于自己的圣诞礼物呢。下面我们为你准备了一些设计素材和教程。

  • 80套圣诞节主题设计素材
  • 16个令人印象深刻的HTML5/CSS3/Javascript实验
  • 49个免费的圣诞主题矢量图像
  • 40个最好的圣诞主题资源
  • 其他圣诞节设计资源
  • 来自w3school的HTML5教程 

春晚 VS. 移动应用:用户注意力统计报告 Twitter发布BootStrap 2.3版本! 面向对象编程从骨子里就有问题——看看名人大家是如何诋毁面向对象的 开发者及团队能从LibreOffice那里学到什么? 8000美元存储135TB数据:打造开源的存储硬件 Bing,每月27亿的有效搜索不及僵尸网络的一半 为什么说Amazon的James Hamilton是“可遇不可求”的? Facebook背后的数据团队 红帽将产品转移到Apache社区 Impala是如何提升3~90倍查询效率的? 云中保障数据安全及完整性必须防范的遗留问题 VMware推出移动性平台:VMware Horizon Suite 移动周报:全球最大校园Hackathon的参赛宝典 Unity3D首届游戏创意设计大赛开始报名 中国日报:向移动新媒体蜕变 C#五子棋程序设计 Mozilla宣布推出Firefox OS 面临四大问题 Ruby 2系列首个稳定版 Ruby 2.0.0-P0发布 微软改进Windows Blue搜索 系统或今夏推出 移动新趋势:扁平化设计 vs. 拟物化设计(下篇) 传奇程序员:Minecraft开发者Notch大神 让沟通更便捷 ConnectYard宣布推出全新的Web API 在Hadoop上运行SQL:程序员需知晓的13种数据工具 怎样用好Eucalyptus? AWS攻势变猛,Rackspace主动降价CDN与云存储 惠普将于下季度推出低功耗的Moonshot服务器 webOS复活!LG收购webOS用于智能电视 那些因为HTML5而将消亡的产品 初窥iWatch用户界面:开创基于时间的全新体验 如何编写出拥抱变化的代码? 20个优秀的前端框架 关于client端与server端的连接问题 请问能不能在不同用户登陆的情况来决定服务A是否启动。 Textbox如何禁止它记忆以前曾经输入过的值? 我的XP的CPU经常占用90%以上,高手指点. 安装完win2000,又安装了天网防火墙,再安装SQL server 2000,快完成时启动服务警告“无法定位程序输入点” 急招深圳周边(含深圳).Net程序员 ??qustion Laney(6吨大肥猫) 快来啊^@^ 有关struts的<html:text>标签的问题!!!!!!!!!!!!!!!!!!!!!!! 为了考试挑灯夜读,遇到一个菜问题请大家帮忙! 哪位高手帮帮我!时间紧急! 关于还原精灵转储后win98不能启动的问题,请指教!~ 有几张漂亮图片,看看你的计算机是怎么累死的 求C++算法代码。 怎么实现在IE中将查找到的关键字用红色标记指示出来? 求C++算法代码。 请问哪里可以下载Numega DevPartenr Studio 测试工具 ㊣㊣ 什么也不多说了,帮忙给解决这个问题吧, 先多谢了!! ㊣㊣ 有个小小问题 寻找监测某端口的数据流量软件 都市幽灵·里面一定有宝藏 非常奇怪:为什么超链接无效? 显示异常 下个星期开始到新公司了,请大家给点经验,好吗 急!jsp+mysql,急寻blob输出方法!!! 修改记录问题 StringGrid的自画 导出 救命呀,关于XP的激活问题. 语句 请问有什么好的串口调试工具,可以模拟串口发送数据的??????? 简单问题高分相送 MessageBox.Show 方法需要什么样的名空间 使用ghost硬盘刻录硬盘怎么区分源盘和目标盘,请大虾详细说说,在线等 概念性问题(没办法,太笨了,见笑了) vf8支持动态SQL吗? 请问:如何单独安装BDE? 因为你无权连接数据库服务器?? 大家看看一个非常专业的商贸企业管理软件,要源码好商量! 如何清除Image中的图片? 数据库查询一个奇怪问题 关于记事本程序的编写??? 揭贴后的话(告诉大家你的问题解决的怎么样) 如何模拟串口发送数据 如何清除Image中的图片? 出售 .Net 自定义服务器端日历控件 *****加班熬夜何时了,辛苦知多少,小楼昨夜又东风,女友不堪回首睡梦中***** VC中使用ACCESS数据库版本的问题? 有高手来看看这个EXCEPTION是怎么回事??????? 我怎么追踪网页向服务器发送的数据 想用VB+SQL SERVER做系统,不知从何下手。 填四大名著《水浒传》中的人物 及时雨( )小旋风( )黑旋风( )智多星(  )豹子头( )神行太保(   )花和尚(  )行者(   )青面兽(  )浪里白头(   ) 柱字开头的成语?马上要 急 关于政治与经济的填空题1.人民政协的主要职能( )、( )、( )大家会哪个就答哪个,写好序号.不会的就空过去. 水浒传主要人物是;智多星——及时雨——黑旋风—— 寓言家克雷洛夫说过:现实是此岸,理想是彼岸,中间隔着湍急的河流,行动则是架在河上的桥梁.以上材料为题材,写一篇不少于1000字的议论文 一道高中政治填空题(经济)国有企业改革的方向是__________,这是________的基础,它的特点是________,__________,_________,__________;国有企业改革的方针是_________结合起来;另外,还要建立和健全_________制 "及时雨会神行太保,黑旋风斗浪里白条"38回涉及到那四条好汉快长板桥头杀气生,横枪立马眼圆睁,一声好似轰雷震,独退曹家百万兵.这局句是在说谁? 苏教版七年级上册数学测试题(有答案) 什么叫做世态炎凉、人间冷暖? 水浒传 及时雨 神行太保 黑旋风 浪里白条分别是谁 带柱的成语(越多越好) 怎样使自己尝遍人间冷暖,世态炎凉? 义勇军进行曲在当时起到了什么作用 请问带"梁"和带"柱"的成语? 政治经济学填空题试论述社会主义实行按劳分配的客观必然性? 深圳经济特区建立30年来取得重大成就的主要原因有哪些?根本原因是什么? 根据范进中举对下联,上联:三十五载梦想,一朝成真,喜极而疯,看尽世态炎凉. 某商场将一种商品降价出售.如果减去定价的10%出售可以盈利209元,如果减去定价的5%出售,亏损80元.此商品的进价是多少元?某商场将一种商品降价出售。如果减去定价的10%出售可以盈利209元, Everyone likes eating ice-cream.Di you every think __1__ where it came from?Who make the first ice-cream?__2___ knows the exact time when it began.Some people said it began __3___ of years ago.Modern(现代的) ice cream first appeared(出现) in Ita 不戚戚于贫贱不汲汲于富贵出自哪篇课文作者是谁 英国的王室有存在的必要么从历史方面回答 它的作用是什么 为什么存在 改革后为什么还延续到今天? 英语完形求解1.She is very good at dance,___everybody knows2,___is known to everybody,the moon travels round the earth once every month3.Have you seen the Titanic,____leading actor is world famous?4.He lives in a hotel,____is only five minute's 证明向量空间必定含有零向量 主父偃是什么意思 翻译 顾吾念之,强秦之所以不敢加兵于赵者,徒以吾两人在也 若向量空间含有向量a,则必定含有-a? 请介绍主父偃 假使我们不去打仗和后面的义勇军进行曲表达的相同的主题是什么? 上联为 故乡尴尬逢闰土 下联为-------于勒 英国皇室会一直存在下去吗?英国皇室威廉王子世纪婚礼又一次引起人们对君主立宪废与立的讨论有支持也有反对总体支持废除君主立宪制的人更多,那么皇室会一直存在下去吗多少年后会被 . 假使我们不去打仗 和 义勇军进行曲 二者在写法上又有什么不同? 《故乡》中造成闰土麻木的主要原因是什么? 已知c/a+b=a/b+c=b/c+a=k,则一次函数y=kx+k经过哪些象限 一元二次问题X^4-X^2-6=0 水浒传中宋江是谁 吴用是谁 柴进是谁 豹子头是谁 花和尚是谁 黑旋风是谁 根据图中五个汉字的不同方位,写出三个成语 上:调 下:腔 左:击 右:声 中:柱上:调 下:腔 左:击 右:声 中:柱 福州化学补习提分快哦?要可靠点的? 求…深圳经济特区成立30周年,写一篇大约400字的论文!从深圳经济特区成立的时间,30周年来的成就!地理优势!自己的的感想!及对深圳的建议!这5个方面写一篇400字的论文!十分感谢!能够有更长 曾经是那样充满生气的闰土,人到中年却活得这样麻木,悲惨的表面上的原因是 福州英语补习提分快哦?要可靠点的? 求一篇初中地理论文,只要400字就行 “颛顼”、“帝喾”怎么读? 正方体ABCD-A1B1C1D1中,棱长为a,E是AA1的中点,在对角面BB1D1D上取一点M,使AM+ME最小,其最小值为要过程 谢谢 含有“柱”字的成语?含有“柱”字的成语是什么啊?想了很久都没想出来也~ 奶是妈妈的好(选择)阅读答案 福州一对一英语补习比较好呢?谁比较懂, 英语翻译 为什么吹一下牛奶(选牛奶是为了看清楚),牛奶就会很规律很对称地划线划圈圈呢? 英语翻译秦应候行千金为反间于赵,曰:秦之所畏,独赵括耳的翻译 含有“柱”“梁”的成语 商场改革经营管理办法后,本月盈利比上月盈利的2倍还多12万元,又知本月盈利比上月盈利多30万元,商场改革经营管理办法后,本月盈利比上月盈利的2倍还多12万元,又知本月盈利比上月盈利多30 福州一对一英语补习哪家好?懂这方便的人来讲下吧? 狮吼虎啸 求狮吼声和虎啸声.能听就行.谢过 中国成立以来,我国交通运输业发展( ) 请问福州英语补习哪家好? “有的声音洪大,听起来如虎啸狮吼.”这句话让我联想到什么成语?(至少两个) . 远洋运输业的程租、期租、和航空运输业的湿租业务,都是什么?来自税法 福州英语补习哪里好? 80克月饼有多大 帝喾是不是帝尧的父亲呀 中国接任联合国安理会2013年11月浙江今日起实时发布县级市AQI指数 北京着手“一日游”综合整治方案 拟建奥巴马叫停国安局对国际货币基金组织与广西岑溪炮竹厂爆炸致7死19伤 事故卫计委:加强医院内部治安管理 保障诊外交部:“东伊运”是中国最直接最现实韩劳工诉日企再获胜 获赔2.3亿韩元到2017年德国医疗保险账户将亏空1黎巴嫩支持召开叙利亚问题第二次日内瓦黎巴嫩支持召开叙利亚问题第二次日内瓦杭州火车东站地裂女子被卡 建设方称系杭州10岁女童遭“淫魔”猥亵 家长怒广西岑溪炮竹厂爆炸 已致7死19伤海军三大舰队西太平洋演习落幕 今后将北京局地达严重污染程度 “蓝天”只能蒙古国高校新增汉语教学点叙问题联合特使称日内瓦会议有望于数周刘奇葆会见朝鲜劳动新闻代表团以色列轰炸加沙致3人死亡印度烟花厂爆炸至少8人死亡有点害怕受表扬让农民“足不出村”就近就业1月8日南石涧村程有才夫妇孝行感动乡邻河南首日抢票2.2万张主板仍低迷 资金出逃急分享健康生活服用阿莫西林“讲究”多今年或许可以“飞”到太行大峡谷姚金成作品研讨会“金边组团”价值凸显“马上得福”抢购一空591路为何乘客稀少小学一二年级不能有寒假作业生活信息集散平台2013,那些影响车市的政策志愿者走进梨园敬老院不要忽视官场雷语的现实逻辑公租自行车今年达万辆儿子不管残疾老人 法律援助解决困难学点家庭保健法
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘