OiiPDF.com

HTML5 and JavaScript Projects, 2nd Edition

Title HTML5 and JavaScript Projects, 2nd Edition
Author Jeanine Meyer
Sub Title Build on your Basic Knowledge of HTML5 and JavaScript to Create Substantial HTML5 Applications
ISBN 148423863X
Year 2018
Pages 425
File Formate PDF
Tags HTML, HTML5 , CSS JavaScript

Book Description

Build on your basic knowledge of HTML5 and JavaScript to create substantial HTML5 applications. Through the many interesting projects you can create in this book, you’ll develop HTML5 skills for future projects, and extend the core skills you may have learned with its companion book, The Essential Guide to HTML5.
HTML5 and JavaScript Projects is fully updated as a second edition and covers important programming techniques and HTML, CSS, and JavaScript features to help you build projects with images, animation, video, audio and line drawings. You’ll learn how to build games, quizzes and other interactive projects; incorporate the use of the Google Maps API and localStorage; and address the challenges of Responsive Design and Accessibility.
Each project starts out with a description of the example’s operation, often with full-color illustrations.  You’ll then review the HTML5 and JavaScript concepts that relate to the project followed by a step-by-step explanation of the programming used. Tables are used to show the relationship of functions and provide comments for each line of code so that you can easily apply the techniques to your own HTML5 projects.​
Developers who have some knowledge of programming and want to build more substantial applications by combining basic features and combining JavaScript with other technologies.

Table Of Content

  • Table of Contents
  • About the Author
  • About the Technical Reviewer
  • Acknowledgments
  • Introduction
  • Chapter 1: Building the HTML5 Logo: Drawing on Canvas with Scaling and Semantic Tags
    • Introduction
    • Project History and Critical Requirements
    • HTML5, CSS, and JavaScript features
    • Drawing Paths on Canvas
    • Placing Text on Canvas and in the Body of a Document
    • Coordinate Transformations
    • Using the Range Input Element
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 2: Family Collage: Manipulating Programmer-Defined Objects on a Canvas
    • Introduction
    • Critical Requirements
    • Autoplay Policy
    • HTML5, CSS, and JavaScript Features
    • JavaScript Objects
    • External File of Specifications
    • Rect
    • Oval
    • Picture
    • Videoblock
    • Heart
    • Creating the Elements
    • Drawing
    • Checking for a Mouse Over Object
    • User Inter face
    • Saving the Canvas to an Image
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 3: Bouncing Video: Animating and Masking HTML5 Video
    • Introduction
    • Project History and Critical Requirements
    • HTML5, CSS, and JavaScript Features
    • Definition of the Body and the Window Dimensions
    • Animation
    • Video Drawing Frames on Canvas or As a Movable Element
    • Video Drawn on Canvas
    • Movable Video Element
    • Traveling Mask
    • User Interface
    • Building the Application and Making It Your Own
    • Making the Application Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 4: Map Maker: Combining Google Maps and the  Canvas
    • Introduction
    • Latitude and Longitude and Other Critical Requirements
    • HTML5, CSS, and JavaScript Features
    • The Google Maps API
    • Canvas Graphics
    • Cursor
    • JavaScript Events
    • Calculating Distance and Rounding Values for Display
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 5: Map Portal: Using Google Maps to Access Your Media
    • Introduction
    • Project History and Critical Requirements
    • HTML5, CSS, and JavaScript Features
    • Google Maps API for Map Access and Event Handling
    • Project Content in External File
    • Distances and Tolerances
    • Regular Expressions Used to Create the HTML
    • Dynamic Creation of HTML5 Markup and Positioning
    • Hint Button
    • Building the Application and Making It Your Own
    • The Quiz Application
    • Testing and Uploading the Application
    • Summary
  • Chapter 6: Add to 15 Game
    • Introduction
    • General Requirements for a Game
    • HTML5, CSS, and JavaScript
    • Styling in CSS
    • JavaScript Arrays
    • Setting Up the Game
    • Responding to a Player Move
    • Generating the Computer Move
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 7: Origami Directions: Using Math-Based Line Drawings, Photographs, and Videos
    • Introduction
    • Critical Requirements
    • HTML5, CSS, JavaScript Features, and Mathematics
    • Overall Mechanism for Steps
    • User Interface
    • Coordinate Values
    • Utility Functions for Display
    • Utility Functions for Calculation
    • Step Line Drawing Functions
    • Displaying a Photograph
    • Presenting and Removing a Video
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 8: Jigsaw Video
    • Introduction
    • Background and Critical Requirements
    • HTML5, CSS, JavaScript, and Programming Features
    • Creating the Base Picture
    • Dynamically Created Elements
    • Setting Up the Game
    • Handling Player Actions
    • Using Mouse Events
    • Calculating If the Puzzle Is Complete
    • Preparing, Positioning, and Playing the Video and Making It Hidden or Visible
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 9: US States Game: Building a Multiactivity Game
    • Introduction
    • Critical Requirements
    • HTML5, CSS, JavaScript Features, Programming Techniques, and Image Processing
    • Acquiring the Image Files for the Pieces and  Determining Offsets
    • Creating Elements Dynamically
    • User Interface Overall
    • User Interface for Asking the Player to Click a State
    • User Interface for Asking the Player to Name a State
    • Spreading Out the Pieces
    • Setting Up the Jigsaw Puzzle
    • Saving and Recreating the State of the Jigsaw Game and Restoring the Original Map
    • Building the Application and Making It Your Own
    • Testing and Uploading the Application
    • Summary
  • Chapter 10: Responsive Design and Accessibility
    • Introduction
    • Critical Requirements
    • Screen Size and Dimension
    • Touch
    • Screen Reader and Tabs
    • HTML, CSS, and JavaScript Features
    • Meta Tags
    • HTML and CSS Use of Percentages and Auto
    • CSS @media
    • The HTML alt Attribute and Semantic Elements
    • HTML tabIndex
    • JavaScript Use of Width and Height Properties
    • Creating Elements Dynamically
    • Choosing From List
    • Mouse Events, Touch Events, and Key Events
    • Building the Reveal Application and Making It Your Own
    • Testing and Uploading the Reveal Application
    • Building the Countries/Capitals Quiz and Making It Your Own
    • Testing and Uploading the Countries/Capitals Quiz Application
    • Testing and Uploading the Jigsaw Turning to Video Application
    • Summary
  • Index