jquery实现文字依次点击验证码效果代码-html代码-BFW代码库

jquery实现文字依次点击验证码效果代码

代码语言：html

所属分类：验证

代码描述：jquery实现文字依次点击验证码效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        body{
        background-color: #1E1E1E;	/* background-size: 100%; */
    }
    
    
    #box{
    	width: 400px;
    	height: 400px;
    	margin: 50px auto 0;
    	border: #00FFFF solid 2px;
    	background-repeat: no-repeat;
    	background-size: 100%;
    	position: relative;
    	transition: all 2s; 
    	border-radius: 10px;
    }
    
    #box .fl{
    	
    	width: 200px;
    	height: 200px;
    	position: absolute;
    	
    }
    
    #box .radio{
    	background-color: #1abd6c;
    	    color: #fff;
    	    z-index: 9999;
    	    width: 30px;
    	    height: 30px;
    	    text-align: center;
    	    line-height: 30px;
    	    border-radius: 50%;
    	    position: absolute;
    	   z-index: 10;
    	   line-height: 30px;
    	   color: white;
    }
    
    #box span{
    	font-size: 40px;
    	position: absolute;
    	z-index: 4;
    	color: blueviolet;
    	font-weight: bold;
    	transition: all 2s; 
    }
    
    #box span:hover{
    	font-family: 'Audiowide';
    	 text-align: center;
    	 color: #E0FFFF;
    	 font-size: 50px;
    	transition: all 1.5s ease;
    	color: #fff;
    	animation: Glow 1.5s ease infinite alternate;
    	margin-bottom: 30px;
    }
    
    @keyframes Glow {
    		    from {
    		        text-shadow: 0 0 10px #fff,
    		                     0 0 20px #fff,
    		                     0 0 30px #fff,
    		                     0 0 40px #C71585,
    		                     0 0 70px #C71585,
    		                     0 0 80px #C71585,
    		.........完整代码请登录后点击上方下载按钮下载查看