Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!-- Page Wrap -->
- <div class="page" id="top">
- <!-- Home Section -->
- <section class="home-section" id="home">
- <div class="js-height-full">
- <div class="plax">
- <div class="parallax__layer parallax__layer__0">
- <img src="images/parallax/parallax0.png" />
- </div>
- <div class="parallax__layer parallax__layer__1">
- <img src="images/parallax/parallax1.png" />
- </div>
- <div class="parallax__layer parallax__layer__2">
- <img src="images/parallax/parallax2.png" />
- </div>
- <div class="parallax__layer parallax__layer__3">
- <img src="images/parallax/parallax3.png" />
- </div>
- <div class="parallax__cover">
- </div>
- </div>
- </div>
- </section>
- <!-- End Home Section -->
- <!-- About Section -->
- <section class="page-section" id="about">
- <div class="container relative">
- <h2 class="section-title font-alt align-left mb-70 mb-sm-40">
- About Studio
- </h2>
- </div>
- </section>
- <!-- End About Section -->
- .plax {
- -webkit-perspective: 100px;
- perspective: 100px;
- height: 100vh;
- overflow-x: hidden;
- overflow-y: auto;
- position: absolute;
- top: 0;
- left: 50%;
- right: 0;
- bottom: 0;
- margin-left: -1500px;
- }
- .parallax__layer {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
- .parallax__layer img {
- display: block;
- position: absolute;
- bottom: 0;
- width: 132%;
- }
- .parallax__cover {
- background: #fff;
- display: block;
- position: absolute;
- top: 100%;
- left: 0;
- right: 0;
- height: 300px;
- z-index: 2;
- }
- .parallax__layer__0 {
- -webkit-transform: translateZ(-300px) scale(4);
- transform: translateZ(-300px) scale(4);
- }
- .parallax__layer__1 {
- -webkit-transform: translateZ(-250px) scale(3.5);
- transform: translateZ(-250px) scale(3.5);
- }
- .parallax__layer__2 {
- -webkit-transform: translateZ(-200px) scale(3);
- transform: translateZ(-200px) scale(3);
- }
- .parallax__layer__3 {
- -webkit-transform: translateZ(-150px) scale(2.5);
- transform: translateZ(-150px) scale(2.5);
- }
Add Comment
Please, Sign In to add comment