TweenMax实现全屏三维页面切换效果代码-html代码-BFW代码库

TweenMax实现全屏三维页面切换效果代码

代码语言：html

所属分类：动画

代码描述：TweenMax实现全屏三维页面切换效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/normalize.css">


    <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Montserrat:400,700'>

    <style>
        html, body {
           height: 100%;
          background: #333;
        }
        
        .site {
            height: 100%;
        }
        
        .container {
          position: relative;
          z-index: 2;
          width: 100%;
          height: 100%;
          
          -webkit-transform-style : preserve-3d;
          -moz-transform-style    : preserve-3d;
          -o-transform-style      : preserve-3d;
          -ms-transform-style     : preserve-3d;
          transform-style         : preserve-3d;
        }
        
        .page-content {
          position: absolute;
          z-index: 2;
          width: 100%;
          height: 100%;
          background: #1abc9c;
        }
        
        #new-content {
          background: #f1c40f;
          z-index: 1;
        }
        
        .page-content p {
          position: absolute;
          width: 100%;
          text-align: center;
          font-family: Montserrat, sans-serif;
          font-size: 75px;
          text-transform: uppercase;
          color: #fff;
          font-weight: 400;
          margin: 0;
        }
        
        #new-content p {
          color: #010101;
        }
        
        .page-content p strong {
          font-weight: 700;
        }
    </style>



</h.........完整代码请登录后点击上方下载按钮下载查看