水一篇代码相关的 blog. 最近在做微信小程序, 设计稿上有一个省略号依次颜色变化组成的 loading 组件. 据说来自微信 UI 设计标准, 可是哪里都找不到, 只能自制了. 顺便吐槽一下小程序的设计和文档, 真是 tmd... 思路 效果主要就是省略号中各个点周期性交替闪烁. 闪烁可以有多种表现形式, 如颜色或者透明度变化, 这方面倒不是什么大问题. 如何支持任意个数的"点"是需要思考的地方. 经过一些实验, 打算采取通过子元素作为 stub…
这是一道我经常在面试中会问的css题：如何实现Android平台上常见的，线条长度会变化的Loading组件： 这是一个我自己也答不出来的题, 问这个题的目的只是试探一下候选人是不是思维特别敏捷或者真的有深厚的css知识，而且也只当附加题助兴。如果真的思路正确甚至能完美答出，那真是遇见水平超出自己的人了。可惜并没有遇到，哪怕是思路靠边的也没有，看来此题并不是一个特别好的面试题。 第一次发现这个的纯css实现， 是在使用公司的。具体Inspect的细节已经不急不清楚了，只记得是根据边框dash…
4 月 1 号打开了 StackOverflow, 看见满屏幕中二元素还以为自己走错了板块. 后来才想到愚人节的事情. 除了独角兽和超 gay 配色, 还有个鼠标下雪的效果还行, 就想着做做看. 思路 目标区域监听事件, 获取鼠标位置. 图形: canvas 还是 DOM? 仔细看原实现, 雪花其实就是*号. 这样 DOM 会方便一些, 但 canvas 也不是不行. 动画: 动画部分由, 和 x, y…
在测试前端解析一个比较大的 Excel 文件时候, 发现我们的 button 的 spinner 卡住了. 印象中即使线程阻塞了, 有些 GPU 加速的东西依然应该有效. 怀疑又是某种 css in js 的弱智用法(没错, 我就是讨厌 css in js). 查看了一下元素发现是用了 svg 的animateTransform. 写法上面感觉跟 css 差不多都是一堆 + . 难道这样也会阻塞吗? 所以做了个测试 demo 结果是, 虽然长得像, 但 css animation…
今年6月份B站暗搓搓(反正我觉得是)上线了个"智能防挡弹幕". 已经记不得自己是什么时候发现的了, 只是觉得有点好玩, 但也仅此而已. 现在闲着无聊, 猜测一下其原理并验证一下. 如果更无聊的话, 再做个demo. What is 智能防挡弹幕 其实就是视频中的人形区域允许弹幕从其"底下"穿过, 做到防止关键♂部位被文字盖住的劳什子功能. 效果见Banner, 虽然雷总没啥可挡的. 多见于尬舞区视频, 我并没有看到很多, 真的. Brain Storm…