jquery实现全屏滚动切换导航效果代码
代码语言:html
所属分类:菜单导航
代码描述:jquery实现全屏滚动切换导航效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html >
<head>
<style>
*, *:before, *:after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.inner, .nav-panel ul .nav-btn:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
}
html, body {
width: 100%;
height: 100%;
overflow: hidden;
}
@media (max-width: 767px) {
body {
font-size: 70%;
}
}
.wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: transform 1.5s;
perspective: 3000;
transform-style: preserve-3d;
}
.wrapper .page {
position: relative;
width: 100%;
height: 100%;
transform: rotateX(180deg) scale(0.3);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: transform 1s ease-in-out;
will-change: transform;
}
.wrapper .page h2 {
color: #fff;
position: absolute;
.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0