web前端
Box-Shadow Loading，可以创造无限可能
Javan
Box-Shadow 通常，我们都是用作弹框阴影、需要层次的的元素等。但是它有更强大的功能，多层阴影，制作一些非常有趣的动画。 box-shadow: h-shadow v-shadow blur spread color inse…
你可能从未使用过的11+个JavaScript特性
⚠重要 这篇文章中描述的大多数功能已被暂停使用。 它们仍然在许多图书中很常见，因此值得学习。 一、逗号运算符 , 是用于分隔表达式并返回链中最后一个表达式的运算符。 let oo = (1, 2, 3) console.log(oo…
CSS进度条式Loading，加载到100%我们的距离就近了
进度条，大家应该都看到过，一个定宽的容器，里面按百分比展示进度，这就是进度条。 CSS + HTML可以很简单的实现进度条功能，下面我们看一个简单示例 示例一 <div class="progress" id="progres…
CSS机械齿轮Loading，爱的魔力转圈圈
前言 “爱的魔力转圈圈，想你想到心花怒放黑夜白天，可是我害怕爱情只是一瞬间，转眼会不见...”，嗨起来，小伙伴们，跟我一起来！ 干啥玩意？这节是计算机课，不是音乐课。 确定不是机械课？ 额，差不太多吧，总之就是玩儿个轮子。 看图，怎…
CSS伪类：CSS3鼠标滑过按钮动画第三节
前言 有了之前的两章，小伙伴们对按钮悬浮动画是否又有了新的认识呢？ 前面两章主要是从背景着手，而本章主要是围绕边框动画做效果。并且，本章节（按钮组:有趣的CSS按钮动画，带你进入CSS世界）也就到此结束了，本章结尾会对前3小节进行一…
CSS伪类：CSS3鼠标滑过按钮动画第二节
前言 有了第一小节的经验，我们可以对直接的动画效果做一些升级效果，如果组合:before、:after，效果有更酷。 请先看一下效果示例吧： 下面一个一个示例讲解 示例一 <button class="btn-1">按钮…
高质量前端快照方案：来自页面的「自拍」
1. 背景 将网页保存为图片（以下简称为快照），是用户记录和分享页面信息的有效手段，在各种兴趣测试和营销推广等形式的活动页面中尤为常见。 快照环节通常处于页面交互流程的末端，汇总了用户最终的参与结果，直接影响到用户对于活动的…
「圣诞特辑」纯前端实现人脸识别自动佩戴圣诞帽
在线体验地址：hksite.cn/prjs/christ… 源码地址：github.com/hk029/chris… 写在开头 叮叮当，叮叮当，吊儿个郎当，一年一度的圣诞节到咯，我不由的回想起了前两年票圈被圣诞帽支配的恐惧。打开票圈…
圣诞快乐：纯CSS绘制圣诞老人头像
前言 圣诞来临前夕，为小伙伴们加更一个有趣的CSS3效果，CSS3圣诞老人，同时祝大家圣诞快乐。 也预示这2019接近尾声，还有心愿和目标没有实现的要加油哦。 下面看看示例图： 图例解析 看了上图，我们先分解一下图形，一步一步实现 …
CSS伪类：CSS3鼠标滑过按钮动画
前言 按钮，对开发者而言，是非常常见的一个功能。前端通常会对按钮加入一些操作交互样式，增加一些用户体验。 比如：hover样式、点击样式、loading样式等。下面我们通过简单示例在学习一下css3动画和css伪类。 示例一 <…