好玩的好玩html网页代码

我昨天半夜刷到一个网页，鼠标点一下屏幕，页代整个页面就炸开成几百个彩色碎片，好玩碎片还会自己拼回去。页代你猜怎么着？好玩那玩意儿没用什么框架，就一个html文件，页代里面塞了不到两百行javascript。好玩我盯着源码看了半天，页代突然觉得这些年折腾vue、好玩react，页代好像把最原始的好玩那份乐趣给丢了。

html最迷人的页代地方，是好玩它没有门槛。你打开记事本，页代敲几个标签，好玩存成.html文件，双击，浏览器就给你渲染出一个世界。我见过有人用纯html做了一个会呼吸的圆——就是一个div加css动画，但那个圆随着鼠标移动变换颜色，像某种深海生物。也见过一个页面，滚动鼠标滚轮，背景里的星星会跟着旋转，整个视角像在穿越虫洞。这些玩意儿不需要服务器，不需要构建工具，甚至不需要联网。

有个细节挺有意思。你查看网页源码的时候，会发现那些好玩的代码往往结构特别乱，注释写得像日记，变量名有叫“temp1”的，也有叫“这个变量千万别删”的。但就是这种粗糙感，反而让人觉得亲切。像小时候在墙上乱涂乱画，虽然歪歪扭扭，但每一笔都是自己的。

我自己也试过。做了一个页面，里面有个小方块，按键盘上下左右键它就会动。后来我加了条规则，方块碰到边缘会弹回来，还带一点弹性形变。就这么个简单的东西，我玩了一下午。看着那个方块在屏幕上弹来弹去，有种说不出的满足感。你可能会说，这有什么好玩的？但就是这种“我写的东西在动”的即时反馈，特别容易上瘾。

再往深了说，html的可玩性在于它允许你犯错。写错一个标签，页面不会崩溃，顶多显示得有点怪。这种宽容度在正经编程里可不多见。我见过有人故意把h1标签写错成h2，然后整个页面的标题顺序全乱了，但页面还是能看。那种错乱反而产生了一种荒诞的幽默感，像在跟浏览器开玩笑。

还有个好玩的方向是canvas。你不需要懂什么图形学，画个随机粒子系统也就几十行代码。我见过一个页面，鼠标划过的地方会留下一条发光的轨迹，轨迹慢慢变淡，像萤火虫飞过的残影。那个作者在代码里写了句注释：“如果你看到这条注释，说明你也在深夜写代码。”我当时就笑了，确实，这种小玩意通常都是半夜搞出来的。

说到这儿，得提一下那些“坏”代码。有些页面上故意放一个按钮，写着“别点我”，你点了就会弹出一个窗口，窗口里又有一个按钮，写着“说了别点”。这种恶作剧式的设计，其实就是利用html的事件触发机制。你明知道是陷阱，还是忍不住去点，然后自己笑出声。这就是html的社交属性——你可以把文件发给朋友，看他们怎么反应。

最后说个实在的。如果你想找这些好玩的代码，别去那些正经教程网站，直接搜“codepen”或者“jsfiddle”，上面全是奇奇怪怪的实验。挑一个你看着顺眼的，点“编辑”，把代码改成自己的，哪怕只是改个颜色，你都会觉得这玩意儿突然变成你的了。那种感觉，比玩任何3A大作都带劲。

html不是语言，是游乐场。你不需要写得多规范，只要玩得开心。下次有空，打开记事本，敲个<marquee>标签，让文字在页面上跑起来，你会懂的。