js实现测试cpu速度代码-html代码-BFW代码库

代码语言：html

所属分类：其他

代码描述：js实现测试cpu速度代码

代码标签： cpu 速度

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


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

<head>

  <meta charset="UTF-8">

  
  
  
<style>
h1#b {
font-size: 60px;
font-family:medula one;
color:#fff;
text-shadow: 0 1px 0 #ccc, 
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}

h1 {
font-size: 75px;
font-family:medula one;
color:#fff;
text-shadow: 0 1px 0 #ccc, 
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}

h1 span {
  -moz-transition: color 1s;
  -webkit-transition: color 1s;
  -o-transition: color 1s;
  transition: color 1s;
}

h1:hover .char1 {
  -moz-transition: color 0.2s;
  -webkit-transition: color 0.2s;
  -o-transition: color 0.2s;
  transition: color 0.2s;
  color: red;
-webkit-transform: scale(0.9);

}

h1:hover .char2 {
  -moz-transition: color 0.2s 0.1s;
  -webkit-transition: color 0.2s 0.1s;
  -o-transition: color 0.2s 0.1s;
  transition: color 0.2s 0.1s;
  color: orange;
}

h1:hover .char3 {
  -moz-transition: color 0.2s 0.2s;
  -webkit-transition: color 0.2s 0.2s;
  -o-transition: color 0.2s 0.2s;
  transition: color 0.2s 0.2s;
  color: yellow;
}

h1:hover .char4 {
  -moz-transition: color 0.2s 0.3s;
  -webkit-transition: color 0.2s 0.3s;
  -o-transition: color 0.2s 0.3s;
  transition: color 0.2s 0.3s;
  color: green;
}

h1:hover .char5 {
  -moz-transition: color 0.2s 0.4s;
  -webkit-transition: color 0.2s 0.4s;
  -o-transition: color 0.2s 0.4s;
  transition: color 0.2s 0.4s;
  color: blue;
}

h1:hover .char6 {
  -moz-transition: color 0.2s 0.5s;
  -webkit-transition: color 0.2s 0.5s;
  -o-transition: color 0.2s 0.5s;
  transition: color 0.2s 0.5s;
  color: indigo;
}

h1 {
font-size: 75px;
font-family:medula one;
color:#fff;
text-shadow: 0 1px 0 #ccc, 
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}

span
{
cursor:pointer;
-webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out; 
}

span#char1:hover {
color: red;

}

span#char2:hover {
  color: yellow;

}

span#char3:hover {
  color: Green;

}

span#char4:hover {
  color: maroon;

}

span#char5:hover {
  color: blue;

}

span#char6:hover {
  color: pink;

}

span#char7:hover {
  color: orange;

}

span#char8:hover {
  color: purple;

}

h2 {
font-size: 75px;
font-family:medula one;
color:#ccc;

-webkit-transition: all .7s ease-out; 
   -moz-transition: all .7s ease-out; 
   -o-transition: all .7s ease-out; 
   transition: all .7s ease-out; 
}

h2:hover{
cursor:pointer;
color:#fff;
text-shadow: 0 1px 0 #ccc, 
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}

h1 {
font-size: 75px;
font-family:medula one;
color:fff;
text-shadow: 0 1px 0 #ccc, 
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}
#vibrate h1 span {
display: inline-block;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 1s ease-in-out 0s;
}

#vibrate h1:hover span {
-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-webkit-animation: amaz 0.2s linear infinite 0.3s;
-moz-animation: amaz 0.2s linear infinite 0.3s;
}



@-webkit-keyframes amaz {
        0% {
                -webkit-transform: rotate(0) scale(1.3);
        }
        25% {
                -webkit-transform: rotate(5deg) scale(1.3);
        }
        50% {
                -webkit-transform: rotate(0deg) scale(1.3);
        }
        75% {
                -webkit-transform: rotate(-5deg) scale(1.3);
        }
        100% {
                -webkit-transform: rotate(0) scale(1.3);
        }
}

@-moz-keyframes amaz {
        0% {
                -moz-transform: rotate(0) scale(1.3);
        }
        25% {
                -moz-transform: ro.........完整代码请登录后点击上方下载按钮下载查看