Cover image for Adobe Edge Preview 5: The Missing Manual

Book description

Want to create animated graphics for iPhone, iPad and the Web, using familiar Adobe features? You’ve come to the right guide. Adobe Edge Preview 5: The Missing Manual shows you how to build HTML5 and JavaScript graphics with Adobe multimedia tools. No programming experience? No problem. Adobe Edge writes all the code for you. With this book, you’ll be designing great-looking web apps in no time.

Table of Contents

  1. Adobe Edge Preview 5: The Missing Manual
  2. SPECIAL OFFER: Upgrade this ebook with O’Reilly
  3. A Note Regarding Supplemental Files
  4. Introduction
    1. Why Use Adobe Edge?
    2. Where to Find Adobe Edge
    3. About This Book
      1. Macintosh and Windows
      2. About the Outline
    4. The Very Basics
      1. About→These→Arrows
    5. About the Online Resources
      1. Missing CD
      2. Registration
      3. Feedback
      4. Errata
      5. Newsletter
    6. Safari® Books Online
  5. One. Working with the Stage
    1. 1. Introducing Adobe Edge
      1. Creating and Saving Edge Projects
      2. A Tour of the Edge Workspace
        1. Saving a Custom Workspace
      3. Building Your First Edge Animation
        1. Viewing Your Animation in a Browser
    2. 2. Creating and Animating Art
      1. Setting the Stage
      2. Creating Art in Edge
        1. Rectangles: Building a Basic Box
        2. Selecting and Copying Elements
        3. Transforming Your Rectangle
      3. Aligning, Distributing, and Arranging Elements
        1. Arranging Elements: Z-Order
      4. A Rectangular Animation
        1. Animating by Adding Property Keyframes
        2. Reviewing and Troubleshooting Your Animation
      5. Rounded Rectangles: More than Meets the Eye
        1. A Circle Is a Very Rounded Rectangle
      6. Importing Art
        1. Showing and Hiding Elements
        2. The Sliding Show
      7. On/Off: Another Way to Show and Hide Elements
    3. 3. Adding and Formatting Text
      1. Adding Text to Your Project
        1. About Text Containers
      2. Changing Text-Specific Properties
        1. About Typefaces and Fonts
      3. Using Web Fonts
        1. Adding Web Fonts to Your Composition
      4. Changing Other Text Properties
      5. Clipping Text Around the Edges
      6. Making That Headline Drop In
      7. Dealing with the Template
      8. Adding Some Bounce
        1. Creating a Bounce Manually
        2. Using Edge’s Prebuilt Bounce
      9. Adding Links to Text
      10. HTML Tags in Edge
  6. Two. Animation with Edge
    1. 4. Learning Timeline and Transition Techniques
      1. Introducing the Timeline
        1. Choosing a Moment in Time
        2. Adding Labels to the Timeline
        3. Editing Labels
      2. Understanding Elements’ Timeline Controls
        1. Showing, Hiding, and Locking Elements
      3. Using Timeline Keyboard Shortcuts
      4. Creating Transitions
        1. Creating Instant Transitions
        2. Setting the Pin for a Smooth Transition
        3. Manually Adding and Removing Property Keyframes
        4. Editing Transitions
        5. Adding Easing, Reversing Motion, and Fine-Tuning Transitions
      5. Dealing with Timeline Claustrophobia
    2. 5. Triggering Actions
      1. Elements, Triggers, and Actions
        1. Trigger Your First Action
      2. Triggering Actions in Other Elements
      3. Triggers and Actions for the Stage and Timeline
        1. Deleting Triggers and Actions
        2. Adding Triggers to the Stage
        3. Editing an Action
      4. Timeline Triggers and Tricks
        1. Adding a Trigger to Loop Your Animation
        2. Using Labels in Your Timeline Code
        3. Adding Triggers to a Point in Time
      5. Sliding Show Revisited
      6. Non-Linear Thinking and Design
      7. Triggers for iPhones and Androids
  7. Three. Edge with HTML5 and JavaScript
    1. 6. Working Smart with Symbols
      1. About Symbols
      2. Building with Symbols
        1. Building a Multipart Leg Symbol
        2. Creating a Curved Line with a Rounded Rectangle
      3. Nesting Symbols within Symbols
      4. Working with Symbol Timelines
      5. Animating a Symbol on the Stage
        1. Duplicating and Renaming Symbols
        2. Deleting or Undoing a Symbol
      6. Create a Button Symbol with Rollover Action
        1. Making Your Button Open a Web Page
      7. Building a Drop-Down Menu System
    2. 7. Working with Basic HTML and CSS
      1. Reading HTML Documents
        1. Playing Tag the HTML Way
        2. Creating a Hyperlink with HTML
      2. Reading CSS Files
        1. Applying CSS Styles to Element IDs and Classes
      3. Reading the HTML Edge Creates
      4. Opening an HTML Document in Edge
      5. Placing Your Composition in an HTML Document
      6. Placing Two Edge Compositions on the Same Page
    3. 8. Controlling Your Animations with JavaScript and jQuery
      1. A Very Brief History of JavaScript and jQuery
        1. JavaScript Versus ActionScript and Other Languages
      2. Sleuthing Through the JavaScript Edge Creates
        1. Adding a New Element to the Stage
      3. JavaScript and jQuery Basics
        1. Operators in JavaScript
        2. Conditional Statements in JavaScript
        3. Understanding the Document Object Model (DOM)
      4. Natural Selection the jQuery Way
      5. “this” and “sym” are Special Words
    4. 9. Helpful JavaScript Tricks
      1. More Showing and Hiding Tricks
        1. Delaying Action for Show, Hide, and Toggle
        2. Fading In and Out
        3. Slip Sliding Up and Down
        4. More Visual Effects with animate()
      2. Swapping Images in Edge
        1. Photo Gallery Revisited
          1. Other Uses for Rollovers
      3. Identifying and Changing Elements and Symbols
        1. Assigning Variables
        2. Using Actions to Assign Variables
        3. Checking Values with Text Boxes and Alert Dialogs
          1. Using Alert() Dialog Boxes to Check Values
      4. Identifying Elements within Symbols
      5. Playing a Symbol’s Timeline
        1. Getting the Current Playhead Position
      6. Using Conditional Statements
  8. Four. appendix
    1. A. Installation and Help
      1. Edge System Requirements
      2. Installing Edge
        1. Installing Edge for Windows:
        2. Installing Edge for Macs:
      3. Uninstalling Edge
        1. Uninstalling Edge for Windows:
        2. Uninstalling Edge for Macs:
      4. Getting Help
        1. Books for HTML, CSS, JavaScript, and jQuery
        2. Online Help
  9. Index
  10. About the Author
  11. SPECIAL OFFER: Upgrade this ebook with O’Reilly
  12. Copyright