site feedback
Create an HTML5 Video Gallery with jQuery

Create an HTML5 Video Gallery with jQuery

with Chris Converse



In this course, author Chris Converse develops an interactive video gallery for the web, working in a coding environment using a combination of HTML5 with a Flash fallback, CSS, and the open-source JavaScript library jQuery. The course shows how to design the site layout and construct the code for a player that works on multiple web browsers, platforms, and mobile devices. Techniques to enable HTML5 video on Android and ensure that older versions of Internet Explorer default to Flash instead of HTML5 are also demonstrated. Exercise files accompany the course.
Topics include:
  • Preparing the graphics
  • Adding and linking thumbnail buttons
  • Designing the layout
  • Adding jQuery and JavaScript
  • Including video information in the thumbnail links
  • Styling the thumbnails with CSS rules
  • Creating a DIV container to hold the video player code
  • Setting up click events for the thumbnails
  • Incorporating the FancyBox lightbox plug-in

show more

author
Chris Converse
subject
Web + Interactive, HTML + HTML5, Interactive, Web Design Projects, Scripting Languages, Developer, Web Development
software
HTML 5, jQuery 1.5
level
Intermediate
duration
59m 53s
released
Jul 28, 2011

Start learning today. Lynda explains how.

Ready to join?

Learn Adobe CS6
Please wait...
subscribe learn more

Get immediate access to the entire library!


Suggested courses to watch next:

Create an Interactive Map with jQuery (47m 38s)
Chris Converse
jQuery Essential Training (04h 09m)
Joe Marini
JavaScript Essential Training (2011) (05h 30m)
Simon Allardice

Are you sure you want to delete this bookmark?

cancel

Bookmark this Tutorial

Name

Description

{0} characters left

Tags

Separate tags with a space. Use quotes around multi-word tags. Suggested Tags:
loading
cancel

bookmark this course

Name

Description

{0} characters left

Tags

Separate tags with a space. Use quotes around multi-word tags. Suggested Tags:
loading

Your queue is full.

Make room for this course by removing some things already in your queue.

go to queue

You must be a lynda.com member to watch this video.

Every course in the lynda.com Online Training Library® contains free movies that let you assess the quality of our tutorials before you subscribe—just click on the blue links to watch them. Become a member to access all 77,421 instructional videos.


If you are already an active lynda.com member, please log in to access the Online Training Library®.

Get access to all lynda.com tutorials

You are currently signed into your admin account, which doesn't let you view lynda.com tutorials. For full access to the Online Training Library®, log in through iplogin.lynda.com, or sign in through your organization's portal. You may also request a user account by calling (888) 335-9632 or emailing us at sales@lynda.com.

Get access to all lynda.com tutorials

You are currently signed into your admin account, which doesn't let you view lynda.com tutorials. For full access to the Online Training Library®, log in through iplogin.lynda.com, or sign in through your organization's portal. You may also request a user account by calling (888) 335-9632 or emailing us at sales@lynda.com.

Access to lynda.com tutorials

Your organization has a limited access membership to the lynda.com Online Training Library® that allows access to only a specific, limited selection of courses.