相信大家都玩过B站，B站在登陆的时候有个拼图滑动验证，今天就整合一下前端实现的滑动验证

拖动滑动验证（无背景图片）

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>拖动滑块验证</title>
</head>
<body><meta charset="utf8"><style>/* 滑动控件容器,灰色背景 */#dragContainer {position: relative;display: inline-block;background: #e8e8e8;width: 300px;height: 33px;border: 2px solid #e8e8e8;}/* 滑块左边部分,绿色背景 */#dragBg {position: absolute;background-color: #7ac23c;width: 0px;height: 100%;}/* 滑动验证容器文本 */#dragText {position: absolute;width: 100%;height: 100%;/* 文字水平居中 */text-align: center;/* 文字垂直居中,这里不能用百分比,因为百分比是相对原始line-height的,而非div高度 */line-height: 33px;/* 文本不允许选中 */user-select: none;-webkit-user-select: none;}/* 滑块 */#dragHandler {position: absolute;width: 40px;height: 100%;cursor: move;}/* 滑块初始背景 */.dragHandlerBg {background: #fff no-repeat center url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==");}/* 验证成功时的滑块背景 有√*/.dragHandlerOkBg {background: #fff no-repeat center url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDlBRDI3NjVGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDlBRDI3NjRGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDphNWEzMWNhMC1hYmViLTQxNWEtYTEwZS04Y2U5NzRlN2Q4YTEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+k+sHwwAAASZJREFUeNpi/P//PwMyKD8uZw+kUoDYEYgloMIvgHg/EM/ptHx0EFk9I8wAoEZ+IDUPiIMY8IN1QJwENOgj3ACo5gNAbMBAHLgAxA4gQ5igAnNJ0MwAVTsX7IKyY7L2UNuJAf+AmAmJ78AEDTBiwGYg5gbifCSxFCZoaBMCy4A4GOjnH0D6DpK4IxNSVIHAfSDOAeLraJrjgJp/AwPbHMhejiQnwYRmUzNQ4VQgDQqXK0ia/0I17wJiPmQNTNBEAgMlQIWiQA2vgWw7QppBekGxsAjIiEUSBNnsBDWEAY9mEFgMMgBk00E0iZtA7AHEctDQ58MRuA6wlLgGFMoMpIG1QFeGwAIxGZo8GUhIysmwQGSAZgwHaEZhICIzOaBkJkqyM0CAAQDGx279Jf50AAAAAABJRU5ErkJggg==");}</style><script>//加载（事件会在页面加载完成后触发）
        window.onload = function() {//获取滑动控件容器,灰色背景var dragContainer = document.getElementById("dragContainer");//获取滑块左边部分,绿色背景var dragBg = document.getElementById("dragBg");//获取滑动验证容器文本var dragText = document.getElementById("dragText");//获取滑块var dragHandler = document.getElementById("dragHandler");//滑块的最大偏移量                 =     滑动验证容器文本长度                  -      滑块长度var maxHandlerOffset = dragContainer.clientWidth - dragHandler.clientWidth;//是否验证成功的标记var isVertifySucc = false;initDrag();function initDrag() {//在滑动验证容器文本写入“拖动滑块验证”
                dragText.textContent = "拖动滑块验证";//给滑块添加鼠标按下监听
                dragHandler.addEventListener("mousedown", onDragHandlerMouseDown);}//选中滑块function onDragHandlerMouseDown() {//鼠标移动监听
                document.addEventListener("mousemove", onDragHandlerMouseMove);//鼠标松开监听
                document.addEventListener("mouseup",  onDragHandlerMouseUp);}//滑块移动function onDragHandlerMouseMove() {/*html元素不存在width属性,只有clientWidthoffsetX是相对当前元素的,clientX和pageX是相对其父元素的*///滑块移动量var left = event.clientX - dragHandler.clientWidth / 2;//
                if(left < 0) {left = 0;//如果滑块移动量   > 滑块的最大偏移量 ，则调用验证成功函数
                } else if(left > maxHandlerOffset) {left = maxHandlerOffset;verifySucc();}//滑块移动量
                dragHandler.style.left = left + "px";//绿色背景的长度
                dragBg.style.width = dragHandler.style.left;}//松开滑块函数function onDragHandlerMouseUp() {//移除鼠标移动监听
                document.removeEventListener("mousemove", onDragHandlerMouseMove);//移除鼠标松开监听
                document.removeEventListener("mouseup", onDragHandlerMouseUp);//初始化滑块移动量
                dragHandler.style.left = 0;//初始化绿色背景
                dragBg.style.width = 0;}//验证成功function verifySucc() {//成功标记，不可回弹
                isVertifySucc = false;//容器文本的文字改为白色“验证通过”字体
                dragText.textContent = "验证通过";dragText.style.color = "white";//验证通过的滑块背景
                dragHandler.setAttribute("class", "dragHandlerOkBg");//移除鼠标按下监听
                dragHandler.removeEventListener("mousedown", onDragHandlerMouseDown);//移除 鼠标移动监听
                document.removeEventListener("mousemove", onDragHandlerMouseMove);//移除鼠标松开监听
                document.removeEventListener("mouseup", onDragHandlerMouseUp);// 匹配成功以后写入你要跳转的页面
                window.location.href="成功页面.html";};}</script>
</head>
<body><div id="dragContainer"><!-- 容器初始背景 --><div id="dragBg"></div><!-- 绿色背景 --><div id="dragText"></div><!-- 滑动容器文本 --><div id="dragHandler" class="dragHandlerBg"></div></div> <!--    滑块         滑块初始背景 -->
</body>
</html>

效果图：

图片滑动验证

css

.block {position: absolute;left: 0;top: 0;
}.sliderContainer {position: relative;text-align: center;width: 310px;height: 40px;line-height: 40px;margin-top: 15px;background: #f7f9fa;color: #45494c;border: 1px solid #e4e7eb;
}.sliderContainer_active .slider {height: 38px;top: -1px;border: 1px solid #1991FA;
}.sliderContainer_active .sliderMask {height: 38px;border-width: 1px;
}.sliderContainer_success .slider {height: 38px;top: -1px;border: 1px solid #52CCBA;background-color: #52CCBA !important;
}.sliderContainer_success .sliderMask {height: 38px;border: 1px solid #52CCBA;background-color: #D2F4EF;
}.sliderContainer_success .sliderIcon {background-position: 0 0 !important;
}.sliderContainer_fail .slider {height: 38px;top: -1px;border: 1px solid #f57a7a;background-color: #f57a7a !important;
}.sliderContainer_fail .sliderMask {height: 38px;border: 1px solid #f57a7a;background-color: #fce1e1;
}.sliderContainer_fail .sliderIcon {top: 14px;background-position: 0 -82px !important;
}
.sliderContainer_active .sliderText, .sliderContainer_success .sliderText, .sliderContainer_fail .sliderText {display: none;
}.sliderMask {position: absolute;left: 0;top: 0;height: 40px;border: 0 solid #1991FA;background: #D1E9FE;
}.slider {position: absolute;top: 0;left: 0;width: 40px;height: 40px;background: #fff;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);cursor: pointer;transition: background .2s linear;
}.slider:hover {background: #1991FA;
}.slider:hover .sliderIcon {background-position: 0 -13px;
}.sliderIcon {position: absolute;top: 15px;left: 13px;width: 14px;height: 12px;background: url(http://cstaticdun.126.net//2.6.3/images/icon_light.f13cff3.png) 0 -26px;background-size: 34px 471px;
}.refreshIcon {position: absolute;right: 0;top: 0;width: 34px;height: 34px;cursor: pointer;background: url(http://cstaticdun.126.net//2.6.3/images/icon_light.f13cff3.png) 0 -437px;background-size: 34px 471px;
}

js

(function (window) {const l = 42, // 滑块边长r = 9, // 滑块半径w = 310, // canvas宽度h = 155, // canvas高度PI = Math.PIconst L = l + r * 2 + 3 // 滑块实际边长function getRandomNumberByRange (start, end) {return Math.round(Math.random() * (end - start) + start)}function createCanvas (width, height) {const canvas = createElement('canvas')canvas.width = widthcanvas.height = heightreturn canvas}function createImg (onload) {const img = createElement('img')img.crossOrigin = "Anonymous"img.onload = onloadimg.onerror = () => {img.src = getRandomImg()}img.src = getRandomImg()return img}function createElement (tagName, className) {const elment = document.createElement(tagName)elment.className = classNamereturn elment}function addClass (tag, className) {tag.classList.add(className)}function removeClass (tag, className) {tag.classList.remove(className)}function getRandomImg () {return 'https://picsum.photos/300/150/?image=' + getRandomNumberByRange(0, 1084)}function draw (ctx, x, y, operation) {ctx.beginPath()ctx.moveTo(x, y)ctx.arc(x + l / 2, y - r + 2, r, 0.72 * PI, 2.26 * PI)ctx.lineTo(x + l, y)ctx.arc(x + l + r - 2, y + l / 2, r, 1.21 * PI, 2.78 * PI)ctx.lineTo(x + l, y + l)ctx.lineTo(x, y + l)ctx.arc(x + r - 2, y + l / 2, r + 0.4, 2.76 * PI, 1.24 * PI, true)ctx.lineTo(x, y)ctx.lineWidth = 2ctx.fillStyle = 'rgba(255, 255, 255, 0.7)'ctx.strokeStyle = 'rgba(255, 255, 255, 0.7)'ctx.stroke()ctx[operation]()ctx.globalCompositeOperation = 'overlay'}function sum (x, y) {return x + y}function square (x) {return x * x}class jigsaw {constructor ({ el, onSuccess, onFail, onRefresh }) {el.style.position = el.style.position || 'relative'this.el = elthis.onSuccess = onSuccessthis.onFail = onFailthis.onRefresh = onRefresh}init () {this.initDOM()this.initImg()this.bindEvents()}initDOM () {const canvas = createCanvas(w, h) // 画布const block = canvas.cloneNode(true) // 滑块const sliderContainer = createElement('div', 'sliderContainer')const refreshIcon = createElement('div', 'refreshIcon')const sliderMask = createElement('div', 'sliderMask')const slider = createElement('div', 'slider')const sliderIcon = createElement('span', 'sliderIcon')const text = createElement('span', 'sliderText')block.className = 'block'text.innerHTML = '向右滑动填充拼图'const el = this.elel.appendChild(canvas)el.appendChild(refreshIcon)el.appendChild(block)slider.appendChild(sliderIcon)sliderMask.appendChild(slider)sliderContainer.appendChild(sliderMask)sliderContainer.appendChild(text)el.appendChild(sliderContainer)Object.assign(this, {canvas,block,sliderContainer,refreshIcon,slider,sliderMask,sliderIcon,text,canvasCtx: canvas.getContext('2d'),blockCtx: block.getContext('2d')})}initImg () {const img = createImg(() => {this.draw()this.canvasCtx.drawImage(img, 0, 0, w, h)this.blockCtx.drawImage(img, 0, 0, w, h)const y = this.y - r * 2 - 1const ImageData = this.blockCtx.getImageData(this.x - 3, y, L, L)this.block.width = Lthis.blockCtx.putImageData(ImageData, 0, y)})this.img = img}draw () {// 随机创建滑块的位置this.x = getRandomNumberByRange(L + 10, w - (L + 10))this.y = getRandomNumberByRange(10 + r * 2, h - (L + 10))draw(this.canvasCtx, this.x, this.y, 'fill')draw(this.blockCtx, this.x, this.y, 'clip')}clean () {this.canvasCtx.clearRect(0, 0, w, h)this.blockCtx.clearRect(0, 0, w, h)this.block.width = w}bindEvents () {this.el.onselectstart = () => falsethis.refreshIcon.onclick = () => {this.reset()typeof this.onRefresh === 'function' && this.onRefresh()}let originX, originY, trail = [], isMouseDown = falseconst handleDragStart = function (e) {originX = e.clientX || e.touches[0].clientXoriginY = e.clientY || e.touches[0].clientYisMouseDown = true}const handleDragMove = (e) => {if (!isMouseDown) return falseconst eventX = e.clientX || e.touches[0].clientXconst eventY = e.clientY || e.touches[0].clientYconst moveX = eventX - originXconst moveY = eventY - originYif (moveX < 0 || moveX + 38 >= w) return falsethis.slider.style.left = moveX + 'px'const blockLeft = (w - 40 - 20) / (w - 40) * moveXthis.block.style.left = blockLeft + 'px'addClass(this.sliderContainer, 'sliderContainer_active')this.sliderMask.style.width = moveX + 'px'trail.push(moveY)}const handleDragEnd = (e) => {if (!isMouseDown) return falseisMouseDown = falseconst eventX = e.clientX || e.changedTouches[0].clientXif (eventX == originX) return falseremoveClass(this.sliderContainer, 'sliderContainer_active')this.trail = trailconst { spliced, verified } = this.verify()if (spliced) {if (verified) {addClass(this.sliderContainer, 'sliderContainer_success')typeof this.onSuccess === 'function' && this.onSuccess()} else {addClass(this.sliderContainer, 'sliderContainer_fail')this.text.innerHTML = '再试一次'this.reset()}} else {addClass(this.sliderContainer, 'sliderContainer_fail')typeof this.onFail === 'function' && this.onFail()setTimeout(() => {this.reset()}, 1000)}}this.slider.addEventListener('mousedown', handleDragStart)this.slider.addEventListener('touchstart', handleDragStart)document.addEventListener('mousemove', handleDragMove)document.addEventListener('touchmove', handleDragMove)document.addEventListener('mouseup', handleDragEnd)document.addEventListener('touchend', handleDragEnd)}verify () {const arr = this.trail // 拖动时y轴的移动距离const average = arr.reduce(sum) / arr.lengthconst deviations = arr.map(x => x - average)const stddev = Math.sqrt(deviations.map(square).reduce(sum) / arr.length)const left = parseInt(this.block.style.left)return {spliced: Math.abs(left - this.x) < 10,verified: stddev !== 0, // 简单验证下拖动轨迹，为零时表示Y轴上下没有波动，可能非人为操作}}reset () {this.sliderContainer.className = 'sliderContainer'this.slider.style.left = 0this.block.style.left = 0this.sliderMask.style.width = 0this.clean()this.img.src = getRandomImg()}}window.jigsaw = {init: function (opts) {return new jigsaw(opts).init()}}
}(window))

引用页面：

<link rel="stylesheet" href="../css/hdyz.css">
<script src="../js/myyz.js"></script>
<div id="captcha"></div>
<script type="text/javascript">jigsaw.init({el: document.getElementById('captcha'),})
</script>

效果图：

谢谢观看！

转载于:https://www.cnblogs.com/huangting/p/11285131.html

前端滑动验证+拼图滑动验证效果相关推荐

  1. php画拼图滑动验证,滑动拼图验证

    3.逻辑:底部滑块的拖动控制小拼图移动,当其左边距与切割位置x坐标一致,或在一定范围内,即为正确:难点在于切割出来拼图,这一步参考上面链接地址: 5.部分源码如下:/** * @name BlockI ...

  2. html四张图片拼图,js实现html滑动图片拼图验证

    本文实例为大家分享了js实现html滑动图片拼图验证的具体代码,供大家参考,具体内容如下 html: Document 向右滑动验证 css: *{ margin: 0; padding: 0; } ...

  3. 【Vue3】滑动验证组件 | 滑动验证

    前言 滑块验证不只判断是否滑动到尾部,真正的目的是检测用户行为,检测行为是人为.脚本.还是其它. 防止使用脚本大量注册.请求等 .比如发送请求时,判断用户在某个页面停留了多长时间.登录.注册时是否点击 ...

  4. 前端实现登录拼图验证

    前言 不知各位朋友现在在web端进行登录的时候有没有注意一个变化,以前登录的时候是直接账号密码通过就可以直接登录,再后来图形验证码,数字结果运算验证,到现在的拼图验证.这一系列的转变都是为了防止机器操 ...

  5. wordpress滑动验证_WordPress图像滑块：滑动还是不滑动？

    wordpress滑动验证 Image sliders (also known as image carousels or slideshows) can be a convenient way to ...

  6. 【TensorFlow】TensorFlow从浅入深系列之七 -- 教你使用验证数据集判断模型效果

    本文是<TensorFlow从浅入深>系列之第7篇 TensorFlow从浅入深系列之一 -- 教你如何设置学习率(指数衰减法) TensorFlow从浅入深系列之二 -- 教你通过思维导 ...

  7. dj鲜生-10-用户注册的继续-错误提示的前端显示-防重名验证

    未完成的继续 注册成功,跳转到首页 注册成功以后,跳转到一个指定的商品 错误提示显示给用户看 如果有什么错误,通过渲染的方式在页面上显示出来 回看检验的那些步骤 都会有数据传给前端 只需要在前端的指定 ...

  8. Keras构建前馈神经网络并使用callbacks输出acc以及loss曲线（训练接、验证集）及效果可视化

    Keras构建前馈神经网络并使用callbacks输出acc以及loss曲线(训练接.验证集)及效果可视化 在每个training/epoch/batch结束时,如果我们想执行某些任务,例如模型缓存. ...

  9. android中界面滑动延伸,android中ViewPager详解--视图滑动、界面卡等效果 （三）

    GuideActivity.java引导界面: import java.util.ArrayList; import java.util.List; import android.app.Activi ...

最新文章

  1. HAProxy高可用配置视频教程
  2. jQuery CheckBox全选
  3. JAVA构造器的实际使用
  4. 引入 ServletContextListener @Autowired null 解决办法
  5. mysql的limit和or_面试官：谈谈MySQL的limit用法、逻辑分页和物理分页
  6. 【Yaml】Yaml学习笔记
  7. 英媒：中国媒体警告将挤走苹果 苹果股价应声下跌
  8. linux文件目录含义,Linux中文件权限目录权限的意义及权限对文件目录的意义
  9. DeepMindVGG提出基于集合的人脸识别算法GhostVLAD,精度远超IJB-B数据集state-of-the-art...
  10. python画关系网图_使用python绘制人人网好友关系图示例
  11. Spring（一）--作用、IOC容器细节、搭配环境、Spring实验
  12. R语言重抽样与自助法
  13. chrome插件开发入门实战——CSDN免登陆拷贝、免关注查看
  14. WAP1.x协议栈浅析-WTP协议
  15. MATLAB绘制中国地图超全教程
  16. Python求二次方程根
  17. win10系统怎么打开pdf文件
  18. Python3.6实现12306火车票自动抢票(附源码)
  19. 云南高性能云桌面搭建解决方案、云桌面与传统PC优势对比，云桌面适用场景分析
  20. ps最大兼容 计算机一级,Photoshop最大兼容是什么意思?最大兼容使用解析

热门文章

  1. 【Linux/Unix】csh中的循环方法
  2. poj Best Cow Line
  3. 前端面试中的自我介绍
  4. hcie 论述-mpls lsp
  5. 计算机网络——路由算法
  6. 微软Google等互联网公司经典面试智力题和解答
  7. python开发中级_针对中级Python开发人员的13个项目构想
  8. 5 CAP理论是什么？
  9. 鸡兔同笼问题的python解法
  10. ETF操作实战记录：2022-2-22