TweenMax实现全屏大气圆环嵌套导航菜单效果代码
代码语言:html
所属分类:菜单导航
代码描述:TweenMax实现全屏大气圆环嵌套导航菜单效果代码
代码标签: TweenMax 全屏 大气 圆环 嵌套 导航 菜单
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url("https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700");
* {
box-sizing: border-box;
}
html,
body {
font-family: "Open Sans Condensed", sans-serif;
margin: 0;
padding: 0;
overflow-x: hidden;
}
body {
background: #FFFFFF;
}
span {
display: block;
background: #566973;
border-radius: 2px;
}
header {
position: absolute;
display: block;
width: 96%;
width: 96vw;
width: calc( 100vw - 64px );
height: 96%;
height: 96vh;
height: calc( 100vh - 64px );
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
-webkit-background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important;
background-size: cover !important;
}
header ul {
position: absolute;
display: block;
width: 100%;
height: 100%;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: 0;
padding: 0;
list-style-type:.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0