Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Demystifying Parallax: Learn to Create Interactive Web Pages
Rating: 4.4 out of 5(137 ratings)
927 students

Demystifying Parallax: Learn to Create Interactive Web Pages

With JavaScript, HTML & CSS
Created byRich Armstrong
Last updated 4/2019
English
English [Auto],

What you'll learn

  • Create a parallax experience with JavaScript, HTML and CSS
  • Understand how to connect (or map) inputs to outputs in JavaScript
  • Understand the theory behind Parallax

Course content

15 sections • 15 lectures • 2h 52m total length

  • Introduction0:59

    Explore the parallax 3D effect and how to hand-code it with JavaScript. Respond to mouse move and scroll events to bring life to web pages, games, and apps.

Requirements

  • A basic knowledge of HTML, CSS & JavaScript
  • A code editor like Sublime Text or Visual Studio Code

Description

You know what parallax is right? It’s that awesome 3D effect we’ve seen in tons of websites, games and apps (like Alto's Adventure for example). Parallax is an interaction delight and it attracts people like crazy. It may appear like voodoo and dark magic, but it’s actually pretty simple to code yourself! In this class I’m going to peel back the illusion that parallax is and show you how to start making interactive web pages with JavaScript.

You'll learn to create an interactive illusion of depth – where items further away move at a slower speed than items that are closer. And you’ll learn to make everything respond to a user's movement, like when the mouse moves or when the page scrolls.

The class is designed for someone with a basic knowledge of HTML, CSS + JavaScript. I do have some beginner classes on HTML + CSS and JavaScript that should get you up to speed.

Throughout this class, we'll cover:

  • Listening for user input (mouse movement and scroll position changes).

  • Connecting element properties like position, blur, and scale to user input.

  • Creating life-like illusions.

  • JavaScript principles.




Who this course is for:

  • Developers wanting to start creating more interactive frontend experiences
  • Designers wanting to who want a fun and friendly way of getting into creative and interactive coding
  • Designers and developers who want a theoretical and a practical course on how to create a parallax experience

Report abuse