YoVDO

Parallax in HTML, CSS and JavaScript Tutorial - Let's Make It Happen

Offered By: DesignCourse via YouTube

Tags

Parallax Effects Courses Computer Science Courses Web Development Courses Javascript Courses Figma Courses HTML Courses Media Queries Courses

Course Description

Overview

Learn how to create a stunning parallax effect using HTML, CSS, and JavaScript in this comprehensive tutorial. Discover the power of Laxxx.js, a lightweight 3kb solution for implementing parallax scrolling. Follow along as the instructor transforms a Figma prototype into a fully functional web page with dynamic, eye-catching parallax elements. Explore essential concepts such as CSS positioning, media queries, and JavaScript implementation. Gain hands-on experience in applying parallax effects to various page elements, including paragraphs, lines, headers, and images. Perfect for mobile-first design, this tutorial provides practical insights into creating engaging, interactive web experiences. By the end, you'll have the skills to bring depth and dimension to your web projects using parallax techniques.

Syllabus

Intro
CSS Code
Position Absolute
HTML Element
Paragraph Element
Line Element
Header Element
H2 Element
Media Queries
Lac CAS
Preserve Nature
Apply Parallax
Parallax Parameters
Mountains
Scroll
Outro


Taught by

DesignCourse

Related Courses

Software as a Service
University of California, Berkeley via Coursera
Intro to Computer Science
University of Virginia via Udacity
Web Development
Udacity
Software Engineering for SaaS
University of California, Berkeley via Coursera
CS50's Introduction to Computer Science
Harvard University via edX