Working with SVG in HTML5 - 20

Download this episode

Download Video

Download captions

Download Captions

Description

Scalable Vector Graphics, or SVG, has been a web standard for many years but has gained renewed interest after being included in the HTML5 specification. SVG allows you to define vector shapes using XML, and these shapes can even be styled with CSS and scripted with JavaScript. In this video, we demonstrate how to use an exported SVG document from Adobe Illustrator in a web page using the img tag as well as embedding the code directly in an HTML5 page. Finally, we show how to add interactivity to an SVG image using JavaScript.

 

Download the source code for Working with SVG in HTML5

Tags:

CSS 3, HTML 5, HTML5, SVG

Embed

Format

Available formats for this video:

Actual format may change based on video formats available and browser capability.

    The Discussion

    • User profile image
      Lionel

      Very interesting and instructive. Thanks for this well done video with simple and easily understandable material !! I also think that SVG can be really promising for the future.

      Regards,

      L.

    • User profile image
      anant

      Plz help me out about "evt" which is passed in the function "clickMe(evt)"
      thnxx

    Comments closed

    Comments have been closed since this content was published more than 30 days ago, but if you'd like to send us feedback you can Contact Us.