Join Chris Converse for an in-depth discussion in this video Animating the caption symbols, part of Create a Homepage Marquee with Edge Animate.
- View Offline
- Exercise Files
Now to position and animate panel_01_ caption, let's come back to the main stage.…Now if you are still in isolation mode, you can come up here to the document breadcrumbs,…come up and click on stage. That will bring us to the main stage.…On the main stage you can select this, and all of these nested items are now inside of…that one symbol called panel_01_caption.…Let's move this down.…Let's set the X position to 20, so come up here to the Properties panel. On the X, let's…set that to 20 and for the Y, we are going to set this to 310.…
Open my stage up a little bit here. I like to put this just a couple of pixels outside.…And remember, our main Stage has the overflow hidden, so anything we paste outside of this…stage area will get clipped inside of the browser.…Next, let's come down to the timeline.…Let's get the playhead at the 2-second mark, make sure panel_01_caption is selected. Let's…come up to the Properties panel. Let's activate the Y property. That's going to give us a…top property here on the timeline. So with the first keyframe in place, let's scrub out…
- Setting up your project
- Creating buttons and converting them to symbols
- Animating symbols
- Detecting a mouse rollover on the stage
- Creating custom interactions with jQuery
- Styling buttons and navigation elements with CSS
- Creating a rollover effect with jQuery
- Adding and removing custom debugging code
Skill Level Intermediate
CSS: Transitions and Transformswith Joseph Lowery2h 25m Intermediate
1. Setting Up Your Project
Animating the panel artwork3m 55s
2. Creating and Animating Symbols
3. Setting Custom Variables and Functions
4. Creating and Linking the Navigation
5. Creating Custom Interactions with jQuery
6. Linking the Caption Buttons
7. The Final Details
Removing the debugging code1m 14s
Where to go from here1m 26s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.