R·ex / Zeng

音游狗、安全狗、攻城狮、业余设计师、段子手、苦学日语的少年。 MUGer, hacker, developer, amateur UI designer, punster, Japanese learner.

分类“开发”下的文章

[完结撒花] 飞机墙的历史 & 揭秘飞机墙的实现方法

本文禁止发布在除 纸飞机技术博客、微信号 nuaazfj 和 /^1?$|^(11+?)\1+$/ | Where there is a will there is a way. 之外的平台，但不限制在社交网站上的转载。纸飞机各种晚会上的飞机墙是不是已经非常吸引大家的眼球了？我从大一接锅开始写，到后来的负责人，然后现在把墙传给了后人。今天就来讲一下飞机墙的历史，然后会花上一些篇幅来解析一下飞机墙在代码上的实现方法。飞机墙，顾名思义就是纸飞机自己的墙，跟人人墙微信墙作用差不多的墙，在晚会上大...
2016-09-05 11:33 开发

NodeJS 的小科普 && 使用 NodeJS 实现 Webhook

本文已授权 Coding博客 转载。距离 NodeJS 这个东西出来已经过了好久了，感觉现在的前端如果不会点 NodeJS 就有点太落后于时代啦。我接触它是从去年暑假开始的，当时在为七牛写一个比较神奇的东西，就顺便接触了一下。虽然网传 npm 社区不是很好，但是我使用了这么久，觉得 NodeJS 还是个很好的工具。本文大概分两部分，前半部分用来向大家介绍 NodeJS，后半部分则是用 NodeJS 写的一个小项目，也就是纸飞机现在正在用的 WebHook。虽然是科普向，但是还是需要先熟悉 ...
2016-08-21 10:18 开发

使用 Chrome Timeline 来优化页面性能

本文已授权 Coding博客 转载。有时候，我们就是会不由自主地写出一些低效的代码，严重影响页面运行的效率。或者我们接手的项目中，前人写出来的代码千奇百怪，比如飞机墙为了一个 Canvas 特效需要同时绘制 600 个三角形，又比如 Coding.net 的任务中心需要同时 watch 上万个变量的变化等等。那么，如果我们遇到了一个比较低效的页面，应该如何去优化它呢？优化前的准备：知己知彼在一切开始之前，我们先打开 F12 面板，熟悉一下我们接下来要用到的工具：Timeline：嗯没错就是...
2016-08-09 23:13 开发

一次 OSU! in Browser 的尝试

OSU! 这个游戏可能许多同学非常陌生，这是一个有着 std、taiko、ctb、mania 四种模式的音乐游戏，其中除了 ctb 我玩不习惯以外，剩下的三个模式均有涉及。一天我突然想到，网上有没有那种能在浏览器中玩的版本？在网上搜了好久，并没有发现“能读取 OSU! 谱面并显示”的代码，只找到了一个有点类似的 Demo（传送门：HTML5太鼓达人），看了一下，并不是我想要的那种效果，而且也不是从 OSU! 谱面中读取的数据。于是我就从太鼓入手，自己写一个吧！但是这工程量实在是大，所以我还...
2016-07-31 23:42 开发

使用 D3.js 制作我们的 Todolist！

算了一下，跟平儿在一起也有八个月了。作为一个程序员男朋友，自然会想写一些东西来提升我们之间的好感度。之前在网上看到有人做了一个特别炫的页面，其实从技术上来说，只是若干图片算好位置、有个计时器、有个打字的效果就解决了。作为一个偏向技术的人，我肯定要写一个更高大上的效果！于是就想到了写一个 Todolist，专门记录那些我们之前在聊天记录中提到过但一直没有做的事情，例如看一场恐怖片啦，躺在地上数星星啦……灵光一闪，就想用一堆浮动的圆圈来代表每一件事情，最好是可以用鼠标拖动的，圆圈最好可以自由移...
2016-07-24 00:59 开发

使用 HTML+CSS 制作纸飞机新 Logo 动效

本文已同步至纸飞机技术博客：使用 HTML+CSS 制作纸飞机新 Logo 动效看到蓝湿父设计的纸飞机新 Logo，感觉比原来的逼格高了好多，于是灵光一闪想出了一个动效，然后脑子一热就想用 HTML+CSS 来实现。先附上最终效果好了：纸飞机 Logo 动效测试那么接下来就一步步来吧！Step1：确定 HTML 结构左边 Logo 的五条线我打算用五个 <div> 来绘制不同颜色的长条，然后用 CSS 做二维变换，变成一个正着的飞机，最后整体逆时针旋转 40° 达到最终效果。右...
2016-06-12 21:29 开发

一次在 Openshift 上折腾 PHPMailer 的经历

本篇已同步至纸飞机技术博客：一次在 Openshift 上折腾 PHPMailer 的经历因为 SAE 太坑，所以我还是把纸飞机的微信和办公系统迁移到了 Openshift 上，并使用了百度云加速。问题就出在这里：我知道要修改 SAE 的一些特性，例如 SaeSegment、SaeCounter，但是没想到还漏了一个 SaeMail，于是服务部的小伙伴们结束维修发邮件的时候就提示 500 了。好吧，那我就改成自己的 Mail 服务呗，到网上下了一个 PHPMailer，然后填好设置，本地测...
2016-06-01 20:03 开发

纸飞机2015新生聚会技术方面总结

聚餐完之后大家都十分兴奋，兴奋完了之后，好好总结一下这次晚会上的技术性成果和失误。今天晚会上的技术性问题有：飞机墙、抽奖、电子节目单。下面分别从每一点来说明。飞机墙飞机墙延续了新飞机墙一贯的风格——六格文字+3D星空背景+卡片翻转特效。此次飞机墙没有任何创新点，但是将原来的随机选择方块替换内容换成了按照顺时针顺序选择方块替换内容，看起来更正常了一些。飞机墙最大的技术性失误是忽略了新生们对于刷墙的热情。在测试的时候没有问题，但是对于前十分钟1000多条的速度还是没有事先预料到。首先，服务器的...
2015-09-04 02:19 开发

【教程】不用JS实现鼠标移过的下拉菜单效果

兼容性：IE≥7（本机无IE6）难度：简单说来惭愧，我一直在用JS来写下拉菜单，一直到去年的10月份。前一阵有同学问我能不能不用JS，我想了想，还是有空写一段吧。【效果演示（可能丑了点）】【实现过程】首先要知道一点知识：鼠标在子元素上的时候，父元素的:hover是开启的。先按照一般的思路写好菜单的HTML框架，本例使用ul和li来制作菜单：<ul> <li>菜单</li> <li>1</li> <li...
2015-02-16 15:55 开发

【mark】移动前端不得不了解的html5 head 头标签

原文地址：移动前端不得不了解的html5 head 头标签 - WEB前端开发看到一篇好文章，留着备用。<!-- 使用 HTML5 doctype，不区分大小写 --> <!DOCTYPE html> <!-- 更加标准的 lang 属性写法 http://zhi.hu/XyIa --> <html lang="zh-cmn-Hans"> <head> <!-- 声明文档使用的字符编码 --> <meta charset='utf-8'...
2015-01-12 19:58 开发

用SAE的Counter减少云豆消耗

刚开始写纸飞机的办公系统，里面有两个地方需要实时更新：维修队列和签到列表。后台用的是PHP嘛，所以前台肯定是用AJAX轮询了。刚开始接触AJAX不久，于是就很脑残地想到了一个思路——每隔3秒AJAX一次，每次返回一个完整的列表信息，然后前台用innerHTML更新。很凶残很暴力，后果嘛——每天云豆消耗大概在20~40左右吧。后来尝试压缩xhr的请求和返回数据大小，发现效果不明显。直到我有一次特意看了看云豆消耗……于是心里十分地卧槽……赶紧想办法减少一下数据库的消耗吧。首先，数据库语句好像没...
2015-01-11 18:24 开发

网页编程心得：语义元素 & 结构、样式和行为的分离

绝大部分的 HTML 标签是有语义的。例如 <p>（paragraph）表示段落，<a>（anchor）表示锚，<abbr>（abbreviation）表示缩写。为什么要有语义？这是显然的，因为 HTML 是用来描述网页文档的一种语言，我说“这里有个标题”，那么 HTML 中应该就是用 <h1> 标签把标题括起来。有同学会问，我把某个 <p> 的文字样式调成加粗、大号字，不是照样能显示出标题效果吗？整个网页都用 <p>...
2014-09-29 23:35 开发
  1. 1
  2. 2
  3. 3
  4. 4
  5. 5

这是我们共同度过的

第 1690 天♥