HTML5 Projects: Engaging Ecommerce

with Joseph Lowery
please wait ...
HTML5 Projects: Engaging Ecommerce
Video duration: 0s 37m 29s Intermediate


The HTML5 Projects series combines HTML5, CSS3, and recent JavaScript API technologies to work—enhancing your web projects with interactivity and multimedia. This installment shows you how to build features that allow visitors to your online store to filter their selections interactively via sliders, drag items onto wish lists, and automatically save them locally. Author Joseph Lowery uses this scenario as an opportunity to introduce concepts such as HTML5 form elements with JavaScript enhancements, local content storage, and drag-and-drop.

Topics include:
  • Including range form elements
  • Modifying the display interactively
  • Establishing JavaScript functions
  • Dragging items to wish lists
  • Storing wish list items locally
  • Saving and retrieving list items
HTML JavaScript CSS


- Hi, I'm Joe Lowery, and I'm so happy you've joined me for HTML5 Projects Engaging Ecommerce. First, I'll show you how to use the coolest of the many new form elements in HTML5, the range input type, to filter catalog items interactively. Next, we'll bring drag and drop into play, so site visitors can pick their favorite products quickly and with a little flair. Finally, I'll demonstrate how to automatically store selected favorites for the user, via the cutting edge Java Script method, known as local storage.

As you go through the course, keep in mind that the ecommerce catalog is just one example of how HTML5 can greatly enhance your users' experience. Alright, let's get started.

please wait ...