canvas
3篇文章 · 0订阅
  • canvas 基础系列（一）之实现抽奖刮刮卡（橡皮擦）
    context 是绘图环境对象，如果你在浏览器中输出 context，你会发现里面包含了许多属性，如：fillStyle strokeStyle等，以及一些函数方法，arc() rect() save() restore() clip()等等。 ⚠️ 不过值得注意的是，调用这个…
    Canvas
  • JS 的平凡之路--学习人气眼中的效果（上）
    首先我们要先获取元素的位置信息，这里我们采用getBoundingClientRect方法，MDN上对于该方法的介绍。然后我们只要与可视区域做个比较，就OK了。 接下来我们需要监听'scroll'事件，判断元素是否出现在可视区域内。对于scroll事件的优化之一，我们需要使用函…
    CSS JavaScript 前端
  • canvas 基础系列（二）之实现大转盘抽奖
    定义点击事件，当点击旋转按钮，执行rotateWheel() 方法，该方法将动态改变全局变量 starRadian的值，并调用 window.requestAnimationFrame()方法实现逐帧旋转动画。 之所以在绘制最开始对画布做清理，是为了完成逐帧动画。 我们可以想象…
    Canvas