Scrolling SVG Sunset
comment 0

Scrolling SVG Sunset

Have you played Firewatch? It is a mystery set in the Wyoming wilderness, where your only emotional lifeline is the person on the other end of a handheld radio. For me it’s definitely therapeutic. If you have, you might as well have visited their website. What do you see? A landscape illustration that moves along a parallax background. But what does parallax mean?

Meriam-webster definition :

The apparent displacement or the difference in apparent direction of an object as seen from two different points not on a straight line with the object; especially:  the angular difference in direction of a celestial body as measured from two points on the earth’s orbit .

Today we will look at parallax content, and even better with SVG!. For certain applications SVG might make a very good alternative: not only would the vector layers of the illustration be small and light, but they could also be recolored and moved individually. If you want to know the how, go ahead and check out the links.

Demo town Let’s go now!

Filed under: JavaScript

About the Author

Posted by

Hakim is the Front End Developer for Stampede. Recently jumped into the boardgames scene. Interested in HCI, Design Thinking and User Experience. Netflix hogger.

Leave a Reply