![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
H5
Jarry96
tired
展开
-
移动端h5实现摇一摇抽奖
话不多说,老规矩,先上预览:blogai.cn 由于新换了服务器,还在备案审核中,所以,前面的预览地址都打不开了,等过几天就好了。 首先,我们先用css实现一个摇动的手机,能很好地带入用户。 实现如下: <style rel="stylesheet" type="text/css"> *{ box-sizing: border-b...原创 2019-03-10 20:12:53 · 4976 阅读 · 0 评论 -
canvas实现滑块验证码,无需任何插件
无需插件,简简单单几行代码实现滑块验证码 话不多说,老规矩,先上Demo,预览地址:blogai.cn 再放几张预览图: 该功能的实现大概有以下几步: canvas 创建两个一样的画布,储存验证图 相同坐标通过fill,clip截取两个验证块 监听鼠标按下事件,记录初始X坐标 监听鼠标移动事件,记录下移动坐标,验证块随着移动 监听鼠标松开事件,记录结束X坐标 对比移动距离和裁剪时的x坐标 ...原创 2019-03-07 23:49:26 · 4907 阅读 · 0 评论