图片拼接类型验证码, 两块图片之间添加一个细线, 遮盖切分的像素误差
This commit is contained in:
parent
e581ced7e8
commit
0aef7d0ad5
@ -9,16 +9,14 @@ import {
|
||||
|
||||
const TYPE = "CONCAT";
|
||||
|
||||
function getTemplate(styleConfig) {
|
||||
function getTemplate() {
|
||||
return `
|
||||
<div class="captcha captcha-slider captcha-concat">
|
||||
<div class="slider-tip">
|
||||
<span class="captcha-slider-move-track-font" >拖动滑块完成拼图</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="captcha-slider-concat-img-div">
|
||||
<img class="captcha-slider-concat-slider-img" src="" alt/>
|
||||
</div>
|
||||
<div class="captcha-slider-concat-img-div"></div>
|
||||
<div class="captcha-slider-concat-bg-img"></div>
|
||||
<div class="captcha-tips"></div>
|
||||
</div>
|
||||
@ -46,7 +44,7 @@ class Concat extends CommonCaptcha {
|
||||
init(captchaData, endCallback, loadSuccessCallback) {
|
||||
// 重载样式
|
||||
this.destroy();
|
||||
this.boxEl.append(getTemplate(this.styleConfig));
|
||||
this.boxEl.append(getTemplate());
|
||||
this.el = this.boxEl.find(".captcha");
|
||||
this.loadStyle();
|
||||
// 按钮绑定事件
|
||||
|
||||
@ -5,6 +5,19 @@
|
||||
transform: translate(0px, 0px);
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 1px;
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
box-shadow:
|
||||
0 0 6px 3px rgb(255 255 255 / 60%),
|
||||
0 1px 4px rgb(0 0 0 / 90%);
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
.captcha-slider-concat-bg-img {
|
||||
width: 100%;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user