diff --git a/parallax/.DS_Store b/parallax/.DS_Store new file mode 100644 index 00000000..1b2d6d6c Binary files /dev/null and b/parallax/.DS_Store differ diff --git a/parallax/Untitled.png b/parallax/Untitled.png new file mode 100644 index 00000000..66874304 Binary files /dev/null and b/parallax/Untitled.png differ diff --git a/parallax/ni.jpg b/parallax/ni.jpg new file mode 100644 index 00000000..cd539ff0 Binary files /dev/null and b/parallax/ni.jpg differ diff --git a/parallax/parallex website.html b/parallax/parallex website.html new file mode 100644 index 00000000..b839e60f --- /dev/null +++ b/parallax/parallex website.html @@ -0,0 +1,83 @@ + + + + + + + + + Parallex web page + + + + +
+ +
+ image not loaded +

NATURE

+
+
+

NATURE SCENES

+

+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Fuga neque non perspiciatis? Dolor voluptas + explicabo earum doloremque quos necessitatibus tempore, natus inventore voluptate et. Consectetur + molestiae vitae dignissimos laboriosam tempore, suscipit quae nemo corrupti incidunt maxime impedit! + Sequi voluptatem odit repudiandae modi magnam, earum impedit commodi praesentium corrupti error + accusantium! +
+
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Impedit minus error modi expedita tempore + itaque unde, harum provident? Quae, voluptatibus. +

+
+

VOLCANO

+
+

+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Fuga neque non perspiciatis? Dolor voluptas + explicabo earum doloremque quos necessitatibus tempore, natus inventore voluptate et. Consectetur + molestiae vitae dignissimos laboriosam tempore, suscipit quae nemo corrupti incidunt maxime impedit! + Sequi voluptatem odit repudiandae modi magnam, earum impedit commodi praesentium corrupti error + accusantium! +
+
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Impedit minus error modi expedita tempore + itaque unde, harum provident? Quae, voluptatibus. +

+ +
+

WATER FALLS

+
+

+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Fuga neque non perspiciatis? Dolor voluptas + explicabo earum doloremque quos necessitatibus tempore, natus inventore voluptate et. Consectetur + molestiae vitae dignissimos laboriosam tempore, suscipit quae nemo corrupti incidunt maxime impedit! + Sequi voluptatem odit repudiandae modi magnam, earum impedit commodi praesentium corrupti error + accusantium! +
+
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Impedit minus error modi expedita tempore + itaque unde, harum provident? Quae, voluptatibus. +

+ +
+

LAKES

+
+

+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Fuga neque non perspiciatis? Dolor voluptas + explicabo earum doloremque quos necessitatibus tempore, natus inventore voluptate et. Consectetur + molestiae vitae dignissimos laboriosam tempore, suscipit quae nemo corrupti incidunt maxime impedit! + Sequi voluptatem odit repudiandae modi magnam, earum impedit commodi praesentium corrupti error + accusantium! +
+
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Impedit minus error modi expedita tempore + itaque unde, harum provident? Quae, voluptatibus. +

+ +
+
+ + + \ No newline at end of file diff --git a/parallax/parallex.css b/parallax/parallex.css new file mode 100644 index 00000000..6b27b974 --- /dev/null +++ b/parallax/parallex.css @@ -0,0 +1,78 @@ +#wrapper{ + height: 100vh; + overflow-x: hidden; + overflow-y: auto; + perspective: 10px; +} +.container{ + position: relative; + display: flex; + justify-content: center; + align-items: center; + transform-style: preserve-3d; + height: 100%; + z-index: -1; + +} +#background{ + transform: translateZ(-40px) scale(5); + +} +#background{ + position: absolute; + height: 100%; + width: 100%; + z-index: -1; + object-fit: cover; +} +h1{ + position: absolute; + top: 3px; + letter-spacing: 5px; + color: rgb(210, 195, 195); + font-size: 10rem; + font-weight: 400; + text-shadow: 0 0 10px rgba(0,0,0.3); + +} +.secheading{ + font-size: 5rem; + padding: 0 10; +} +.text{ + font-size: 1rem; + padding: 0 10; + margin: 3rem 0; +} + +section{ + background-color: rgb(45, 45 ,45); + color: white; + padding: 5rem 0; +} +.bg1{ + background-image: url(pexels-tirachard-kumtanom-347145.jpg); +} +.bg2{ + background-image: url(pexels-ray-bilcliff-1493839.jpg); +} +.bg3{ + background-image: url(pexels-eberhard-grossgasteiger-518485.jpg); +} +.bg{ + position: relative; + width: 100%; + background-attachment: fixed; + background-size: cover; + height: 350px; +} +h2{ + position: absolute; + background-color: white; + color: black; + padding: 0.5rem 2.5rem; + top: 37%; + left: 37%; + font-size: 1.5rem; + font-weight: 600; +} \ No newline at end of file diff --git a/parallax/pexels-eberhard-grossgasteiger-518485.jpg b/parallax/pexels-eberhard-grossgasteiger-518485.jpg new file mode 100644 index 00000000..0748cd25 Binary files /dev/null and b/parallax/pexels-eberhard-grossgasteiger-518485.jpg differ diff --git a/parallax/pexels-jaime-reimer-2662116.jpg b/parallax/pexels-jaime-reimer-2662116.jpg new file mode 100644 index 00000000..b8791bb9 Binary files /dev/null and b/parallax/pexels-jaime-reimer-2662116.jpg differ diff --git a/parallax/pexels-liger-pham-1108701.jpg b/parallax/pexels-liger-pham-1108701.jpg new file mode 100644 index 00000000..49a1c031 Binary files /dev/null and b/parallax/pexels-liger-pham-1108701.jpg differ diff --git a/parallax/pexels-peter-spencer-663487.jpg b/parallax/pexels-peter-spencer-663487.jpg new file mode 100644 index 00000000..2faf0e7d Binary files /dev/null and b/parallax/pexels-peter-spencer-663487.jpg differ diff --git a/parallax/pexels-pixabay-147411.jpg b/parallax/pexels-pixabay-147411.jpg new file mode 100644 index 00000000..c5838737 Binary files /dev/null and b/parallax/pexels-pixabay-147411.jpg differ diff --git a/parallax/pexels-ray-bilcliff-1493839.jpg b/parallax/pexels-ray-bilcliff-1493839.jpg new file mode 100644 index 00000000..cc3209d7 Binary files /dev/null and b/parallax/pexels-ray-bilcliff-1493839.jpg differ diff --git a/parallax/pexels-tirachard-kumtanom-347145.jpg b/parallax/pexels-tirachard-kumtanom-347145.jpg new file mode 100644 index 00000000..485f8cb6 Binary files /dev/null and b/parallax/pexels-tirachard-kumtanom-347145.jpg differ