jquery.parallax+particles实现粒子悬浮视觉差异效果代码-html代码-BFW代码库

jquery.parallax+particles实现粒子悬浮视觉差异效果代码

代码语言：html

代码描述：jquery.parallax+particles实现粒子悬浮视觉差异效果代码

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

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

<head>
    <meta charset="UTF-8">
    <style>
        @import url(https://fonts.googleapis.com/css?family=Lato:400,300,100);
                body {
                font-family:"Lato";
                background:#2980b9;
                overflow:hidden;
                height:100%;
                width:100%;
                -webkit-font-smoothing:antialiased;
                -webkit-user-select:none;
                -moz-user-select:none;
                -ms-user-select:none;
                user-select:none
        }
        #particles-js,#parallax,.layer,.some-space,.some-more-space {
                height:100%;
                position:absolute;
                width:100%
        }
        #particles-js {
                opacity:.6
        }
        h1 {
                color:white;
                font-size:5em;
                font-weight:100;
                letter-spacing:.2em;
                position:absolute;
                top:50%;
                left:50%;
                transform:translate3d(-50%,-50%,0)
        }
        a {
                color:white;
                border:1px solid white;
                display:table;
                position:absolute;
                top:60%;
                left:50%;
                letter-spacing:.05em;
                transform:translate3d(-50%,-50%,0);
                text-decoration:none;
                transition:all 200ms ease;
                padding:10px 15px
        }
        a:hover {
                background:white;
                color:black
        }
        .some-space {
                animation:rotate 18s .5s infinite linear reverse
        }
        .some-more-space {
                -webkit-animation:rotate 15s .1s infinite linear;
                animation:rotate 15s .1s infinite linear
        }
        @-webkit-keyframes rotate {
                0% {
                transform:rotateZ(0deg) translate3d(0,1.5%,0) rotateZ(0deg)
        }
        100% {
                transform:rotateZ(360deg) translate3d(0,1.5%,0) rotateZ(-360deg)
        }
        }@keyframes rotate {
                0% {
                transform:rotateZ(0deg) translate3d(0,1.5%,0) rotateZ(0deg)
        }
        100% {
                transform:rotateZ(360deg) translate3d(0,1.5%,0) rotateZ(-360deg)
        }
        }
    </style>
</head>

<body>

    <div id="parallax">
  .........完整代码请登录后点击上方下载按钮下载查看