R·ex / Zeng


音游狗、安全狗、攻城狮、业余设计师、段子手、苦学日语的少年。

分类“开发”下的文章

一个由全屏引发的问题

最近在搞一个跟全屏有关的东西,我知道 Fullscreen API 浏览器的支持很有限,于是在写的时候加足了浏览器的私有前缀,包括 CSS:.video-container-inner:-webkit-full-screen, .video-container-inner:-moz-full-screen, .video-container-inner:-ms-fullscreen, .video-container-inner:fullscreen { position: fix...

翻一翻自己的黑历史——rscss、rsjs

惯例在写正文之前扯一堆没用的,想直接看正文的话可以点 这里。敢于自爆黑历史也是一种勇气。刚才无意间看到了 AmazeUI。没忍住于是发了条动态:现在再看 AmazeUI 感觉已经不是那么回事了,现在的几大前端框架以及各种工具改变了前端开发的几乎全部内容,除了基础语法以外都得重新学。。明明才过去几年啊。。想当年我还在纠结于写一个 CSS 库(类似于 <input> 等标签的样式库),某人问我:“你听说过可以点击链接不跳转页面,直接局部刷新的东西没?”我还觉得很不可思议,一个月后的...

CSS 中关于 overflow 的限制和绕过方法

在写毕设的时候遇到了一个看起来很难搞的问题。假设有如下 HTML 结构:<div class="scrollable"> <table> <thead> <!-- headers --> </thead> <tbody> <!-- contents --> </t...

Laravel 版本与 PHP 版本之间的坑

又到了一年一度五四评优的季节,技术部又有的忙了。作为陪伴这套系统时间最长的人,也是目前唯一了解全部技术细节的人,我自然需要帮现在负责的同学们一点小忙。于是我又把这套系统 clone 了下来。如果用的是 Apache,那么 Laravel 已经有了 .htaccess 文件;但是Nginx 的配置并不像官方说的那么简单,下面是我尝试了许多次才配置成功的:location /evaluation { if (-d $request_filename) { rewrite...

讲一讲 Canvas 究竟是个啥

本文已授权 Coding博客 转载。HTML5 的标准已经出来好久了,但是似乎其中的 Canvas 现在并没有在太多的地方用到。一个很重要的原因是,Canvas 的标准还没有完全确定,不适合大规模用在生产环境。但是,Canvas 的优点也是很明显的,例如在绘制含有大量元素的图表的时候,SVG 往往因为性能问题而无法胜任,例如我见过的一次技术分享会的抽奖环节,虽然效果比较炫,但因为每个头像都是 DOM,利用 CSS3 控制的动画,导致了性能非常低下。此外,随着硬件性能的提高,视频截图、图像处...

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

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

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

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

使用 Chrome Timeline 来优化页面性能

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

一次 OSU! in Browser 的尝试

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

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

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

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

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

一次在 Openshift 上折腾 PHPMailer 的经历

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

这是我们共同度过的

第 1426 天