品味前端

摘要： 一般情况下 CSS 并不会影响 JS 事件，但有一个 CSS 属性则比较特殊，那就是 pointer-events，它可以用来规避鼠标事件，其中大部分属性值只适用于 SVG（可缩放矢量图形）操作，而我们只需要关注其 none 属性值，该值表示鼠标事件“穿透”该元素并且指定该元素“下面”的任何东西。 阅读全文

摘要： 颜色一直是UI设计师们非常敏感的问题，我至今仍忘不了那天，一位萌新设计师在走查UI时，给我提了好几个Bug，大多是颜色有差异问题，我当时的第一反应是去检查代码，排查了半天确认自己没有写错色值后，我就在想会不会是取色的问题？于是我做了个试验，在网页上设置一个背景色，然后用Chrome自带的取色器吸了一 阅读全文

摘要： 我们都知道有两种盒模型，w3c盒模型和IE盒模型。content-box，顾名思义，即width就是内容宽度，和边框边距相互独立，反过来 border-box 就是宽度包含了padding和border，相互影响。 现代浏览器默认的都是w3c标准，但IE盒模型并非一无是处，甚至很多情况下它会更好用， 阅读全文

摘要： 在某些业务场景下，接入第三方库实现轮播图效果可能并没有那么好用，笔者在接入Swiper插件失败后，还是决定手写一个。那么关于手写轮播图有很多文章已经讲过了，其核心原理是将图片排成一排，设置外层的Div超出隐藏，然后改变定位来实现轮播效果，这样通常不能首尾循环滚动，本文记录了一种对无限循环滚动效果的实 阅读全文

摘要： 我正在参加「创意开发 投稿大赛」详情请看：掘金创意开发大赛来了！ 先来看看b站的一键三连是什么效果： 不难观察出以下几个特点： 长按点赞出现抖动动画 长按点赞时关联按钮会有圆环进度条效果 长按超过一段时间后放开则一次实现三个动作并且有个绽放特效 接下来我们要做的就是逐步实现这些步骤，如何开始呢？这就 阅读全文

摘要： 我正在参与掘金创作者训练营第5期，点击了解活动详情 node.js 初探 Node.js 是一个 JS 的服务端运行环境，简单的来说，它是在 JS 语言规范的基础上，封装了一些服务端的运行时对象，让我们能够简单实现非常多的业务功能。 如果我们只使用 JS 的话，实际上只是能进行一些简单的逻辑运算。n 阅读全文

摘要： 项目の初 该从哪里说起呢。。回想当时我还在做着一些零散的项目需求，这时候领导给了我一个任务，说让我重构一个“在线PS”，我一听哎，这有点意思了，但是它并没有立项，是的，直到我做了一个多月，团队里还没有其他人知道这个项目的存在，所以我要在搞完其他需求之后挤出来的时间里完成它的开发（因为连PM都不清楚我 阅读全文

摘要： 前篇：# (一) 基本功能 、 # (二) 常用参数实现、 # (三) 页面处理 JS实现异步任务队列 由于截图服务每次执行任务都需要占用不少时间和性能，且服务器资源有限，如果截图服务并发请求数量过高，必然会引起问题，此时就需要一个异步任务队列来对并发的浏览器数量进行控制。 对 queue 感到陌生 阅读全文

摘要： # (一) 基本功能 # (二) 常用参数实现 如何在页面中判断图片已加载完成 主动调用注入函数进行截图的场景，通常都是我们自己的业务页面，这时我们可以在页面中对资源加载情况进行判断，来决定截图的时机。 起初我的想法是把图片url链接传进一个处理函数，函数中用Image对象加载src，当实例对象触发 阅读全文

摘要： 本篇主要介绍一些参数实现，完整文章目录： # (一) 基本功能 # (二) 常用参数实现 # (三) 页面处理的方法 # (四) 项目优化及部署相关 页面等待 有时我们可能希望让页面等待一段时间再执行截图，当使用await page.waitFor(1000)来让页面等待时会提示该方法将被弃用： w 阅读全文