那么,我们有代码挑战#1 的获胜者吗?

0 Comments

距离我们发起快速代码挑战 #1已经过去一周了,这意味着是时候宣布获胜者了!这很棘手。虽然参赛作品的数量并不多,但我们获奖作品的质量是毋庸置疑的。 但首先,让我们通过几种不同的方法来应对我们提供的挑战。 先轮到我了! 当我为这个挑战制定规则时,我认为我首先接受挑战是公平的。 (*不,我不能把奖颁给自己……好吧,我很确定我不能……对吧。

平分一等奖:尼克沃顿

我尝试了 CSS 和 SVG 解决方案——我更擅长的两个——并决定不使 黎巴嫩电话号码表 用任何脚本。由于 CSS 或 SVG 中都没有真正的随机函数,因此技巧始终是让常规动画循环看起来比实际更随机。这是我的解决方案。 Learn to Code with JavaScript 请随意浏览代码,但主要的兴趣点是: EKG 线动画仅使用一个外部 SVG 和两个独立的动画循环。 一个 CSS 动画(旅行)从左到右循环绿色渐变。

下一步是什么?代码挑战 #2:CSS 之战

叠加掩模塑造心电图线。 我在 SVG 图形上创建了 6 个独特的“EKG 心跳”,并将 清洁麦 它们设置为精灵关键帧。我正在切换这些关键帧以使它们看起来随机(我在底部添加了微小的数字以使关键帧切换更加明显)。 第二个动画将每个“心跳”视为一个单独的精灵,并在每次传递时切换到一个新的精灵 – 但这被定时为仅在循环的黑暗部分发因此我们通常期望它们都显示相同的关键帧。

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

Related Posts