You’ve asked for the code snippets of the Merry Christmallax and in this post I share with you a screencasts related to CodePen examples demonstrating how the site was put together.
The First section – The Sketched Tree
In the first set of the screencasts I am deconstructing the steps taken to build the sketched version of the tree.
You will learn:
- How I did export the assets from Photoshop
- How were the assets optimised
- How I positioned them on the page
- How to set the right skrollr data attributes
- How to work out the right timing for scrolling animations.
1. From PSD to HTML, CSS [13:37]
2. Skrollr data attributes explained [13:12]
3. Skrollr fade in/out animations [10:10]
If you have enjoyed this deconstruction, you will find other useful info in The Making of Merry Christmallax ebook.
I would also love to hear your feedback on my first screencast/CodePen combination. Have you find it useful? Or did I miss something?
Please leave a comment. That will help me to make even more useful content for you in my future posts.
Like What You're Reading?
Sign up to receive my future tutorials and demos straight to your inbox.
No spam, Unsubscribe at any time.