js实现三维动态旋转的checkbox组合验证码效果代码
代码语言:html
所属分类:验证
代码描述:js实现三维动态旋转的checkbox组合验证码效果代码,把底部的checkbox勾选跟上面一样才能通过验证。
代码标签: js 三维 动态 旋转 checkbox 组合 验证码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
html,
body {
margin: 0;
padding: 0;
width: 100vw;
height: 100vh;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
perspective: 100vw;
}
.Area {
display: flex;
justify-content: center;
align-items: center;
height: 40vh;
animation: Rotate3D 20s infinite linear;
transform-style: preserve-3d;
}
.Slice {
display: flex;
position: absolute;
transform-style: preserve-3d;
}
@keyframes Rotate3D {
100% {
transform: rotateY(360deg);
}
}
input {
width: min(6vw, 6vh);
height: min(6vw, 6vh);
}
</style>
</head>
<body translate="no">
<div class="Area"></div>
<div class="Area"></div>
<script >
function Initial() {
var AreaList = docume.........完整代码请登录后点击上方下载按钮下载查看
网友评论0