Join Chris Converse for an in-depth discussion in this video About the exercise files, part of Creating an HTML5 Banner Ad with GreenSock (GSAP).
- The exercise files for this course are available to all members, and include an HTML file and a graphics .PNG file. Now, inside of the HTML file, I have a basic HTML5 document structured here, we have a heading area and a body area, there's a style element with two rules. One rule, which brings in a Google font, and then second, we have a body element that just defines the background of the page. The rest of the HTML and CSS we're gonna be building throughout the course. We're first going to construct our banner advertisement layout before we start animating it. And the graphic file inside of that same folder is a semi-transparent sprite sheet.
In this course, Chris Converse shows how to combine GreenSock with HTML, CSS, and a sprite sheet graphic, to create a complete animated banner ad. He'll also introduce techniques for combining animations, rearranging elements, and jumping to specific points in the animation for testing. Plus, find out how to streamline your ad by serving just the files you need—reducing the file size and download speed.
The exercise files are free to all members. Download them and get started building your own project with GreenSock.
- Downloading GSAP
- Creating the ad layout, link, and constraint
- Adding the photos and text
- Animating the artwork
- Setting the ad to fade in on load
- Animating the letters of a headline