Commit a06f0ce

authored

Add files via upload

1 parent ab9dbeb commit a06f0ceCopy full SHA for a06f0ce

File tree

+75

-0

lines changed

+75

-0

lines changed

Lines changed: 16 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,16 @@`
	`1`	`+<!DOCTYPE html>`
	`2`	`+<html lang="en">`
	`3`	`+ <head>`
	`4`	`+ <meta charset="UTF-8">`
	`5`	`+ <meta name="viewport" content="width=device-width" , initial-scale="1.0">`
	`6`	`+ <meta http-equiv="X-UA-Compatible" content="ie=edge">`
	`7`	`+ <title>Parallax Effect \| Pure CSS \| No JavaScript</title>`
	`8`	`+ <link rel="stylesheet" href="style.css">`
	`9`	`+ </head>`
	`10`	`+ <body>`
	`11`	`+ <header>`
	`12`	`+ <h1>Parallax Effect</h1>`
	`13`	`+ <p>Pure CSS // No JavaScript !</p>`
	`14`	`+ </header>`
	`15`	`+ </body>`
	`16`	`+</html>`

Lines changed: 59 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,59 @@`
	`1`	`+html`
	`2`	`+{`
	`3`	`+ height: 100%;`
	`4`	`+ overflow: hidden;`
	`5`	`+}`
	`6`	`+`
	`7`	`+body{`
	`8`	`+ color: #fff;`
	`9`	`+ margin: 0;`
	`10`	`+ padding: 0;`
	`11`	`+ perspective: 1px;`
	`12`	`+ transform-style: preserve-3d;`
	`13`	`+ height: 100%;`
	`14`	`+ overflow-y: scroll;`
	`15`	`+ overflow-x: hidden;`
	`16`	`+ font-family: "Luna";`
	`17`	`+}`
	`18`	`+`
	`19`	`+header{`
	`20`	`+ box-sizing: border-box;`
	`21`	`+ min-height: 100vh;`
	`22`	`+ padding: 30vw 0 50vw;`
	`23`	`+ position: relative;`
	`24`	`+ transform-style: inherit;`
	`25`	`+ width: 100vw;`
	`26`	`+}`
	`27`	`+`
	`28`	`+header h1{`
	`29`	`+ margin-top: -100px;`
	`30`	`+}`
	`31`	`+`
	`32`	`+header, header:before`
	`33`	`+{`
	`34`	`+ background: 50% 50% /cover;`
	`35`	`+}`
	`36`	`+`
	`37`	`+header::before{`
	`38`	`+ bottom: 0;`
	`39`	`+ content: "";`
	`40`	`+ left: 0;`
	`41`	`+ position: absolute;`
	`42`	`+ right: 0;`
	`43`	`+ top: 0;`
	`44`	`+ display: block;`
	`45`	`+ background-image: url("https://lh3.googleusercontent.com/proxy/nE4Q-xhr-mpr9y91flBNErYxMgVq_DHCqChFpeMoW5hHFqUJ535Jf4SdOJBVG5NREq1nJywn6BVzQCrbOXB8A5RO8QZJ3rBhMdVrRwjeXmK2zdkoCw");`
	`46`	`+ background-size: cover;`
	`47`	`+ background-origin: center center 0;`
	`48`	`+ transform: translateZ(-1px) scale(2);`
	`49`	`+ z-index: -1;`
	`50`	`+ min-height: 100vh;`
	`51`	`+}`
	`52`	`+`
	`53`	`+header *{`
	`54`	`+ font-weight: normal;`
	`55`	`+ letter-spacing: 0.2em;`
	`56`	`+ text-align: center;`
	`57`	`+ margin: 0;`
	`58`	`+ padding: 1em 0;`
	`59`	`+}`

Comments

(0)