JS实现滑动拼图验证，对网络技术基础的认识与了解

设置画布滑块属性

const l = 42, // 滑块边长

r = 10, // 滑块半径

w = 310, // canvas宽度

h = 155, // canvas高度

PI = Math.PI

const L = l + r * 2 // 滑块实际边长

设置背景图片：

图片链接地址可以自行更换

function getRandomImg() {

return ‘https://picsum.photos/300/150/?image=’ + getRandomNumberByRange(0, 100)

}

CSS部分代码：

.container {

width: 310px;

margin: 100px auto;

}

#msg {

width: 100%;

line-height: 40px;

font-size: 14px;

text-align: ce