2013
Lynda
Justin Putney
1:25
English
Follow along with author Justin Putney as he uses open technologies (HTML5, jQuery, and CSS) to create a dynamic presentation slideshow that responds to mobile and desktop layouts. Learn to customize the slideshow to fit your next project, and to display artwork, photography, and other kinds of content.
Discover how to structure the HTML and slide content; design the navigation to react to clicks, keyboard input, and swipe gestures; and use CSS to customize the slide display for different screens and animated transitions. Justin also includes a series of challenge-and-solution pairs to test your skills.
Introduction 2m 22s
Welcome 42s
Prerequisites for this course 41s
Using the exercise files 21s
Using challenges 38s
1. Understanding the Project 2m 16s
Exploring the final results 52s
Exploring highlighted HTML5, CSS3, and JavaScript (jQuery) technologies 1m 24s
2. Creating Slides 14m 18s
Structuring the HTML 1m 31s
Creating slide content 1m 24s
Creating the default slide appearance 11m 23s
3. Displaying Pages and Creating Navigation 25m 37s
Using jQuery to display the current page 8m 36s
Adding click and keyboard navigation 5m 14s
Adding swipe gestures for mobile 5m 58s
Challenge: Customized keyboard navigation 32s
Solution: Customized keyboard navigation 1m 2s
Challenge: Create a pause screen 50s
Solution: Create a pause screen 3m 25s
4. Creating a Responsive Layout 38m 14s
Deciding how elements will respond 1m 39s
Translating ideas into CSS 8m 26s
Using media queries to adjust the layout 8m 25s
Full screen 4m 31s
CSS transitions 8m 39s
Challenge: Creating a responsive text shadow 52s
Solution: Creating a responsive text shadow 5m 42s
Conclusion 2m 14s
Next steps 2m 14s

http://www.lynda.com/CSS-tutorials/HTML5-Projects-Creating-Responsive-Presentation/129007-2.html

Download File Size:266.94 MB

---