From the course: Creating a Responsive Web Experience

About the exercise files

This course contains two sets of exercise files. If you're a premium subscriber to the lynda.com online training library, you'll have access to all three of these folders. If you're not a premium subscriber, you'll have access to folders two and three. Now inside of folder one are the source Photoshop files with the slices intact for the modifications that we've made for this course. Inside of folder two are the files that we're going to be adding to our project. Inside of the CSS folder is an IE 7 and 8 CSS file. We're going to be redefining some of the CSS 3 properties from this course, so that we can maintain backwards compatibility with IE 7 and 8. Inside of the images folder are all of the modified files from folder one. So if you don't have access to folder one, or you want to skip the Photoshop section, you can come in here and copy these images. They include all of the modified banners, the updated call to action arrow, and the mobile link arrow. And then inside of the JavaScript file, we have a design.js file. This is a blank file where we're going to be writing all of our scripts to make our responsive web experience. Next is a copy of the image preload script from Far in Space. We got written permission from Dimas Begunoff to include these in our exercise files. A copy of jQuery 1.8, again to maintain backwards compatibility with IE 7 and 8. And we also have a copy of respond.js in here, which is also for IE 7 and 8, to give them the ability to read CSS 3 media queries and give us multiple layouts across different screen sizes. And finally, inside of folder three, for snippets we have some HTML content for the hero area. This is the HTML that we're going to dynamically switch out in the heading area. Now from this course, I'll be continuing on from an earlier lynda.com course called Creating a Responsive Web Design. In that course, we taught you how to combine HTML and CSS to change a layout based on the user's screen size using responsive design techniques. So if you've completed that course, you can start from that particular project. You can also start this course from any responsive design project that you have. We're going to be adding CSS and JavaScript from the exercise files, and then we'll write our own JavaScript to change the structure of the HTML based on the user's screen size. So now that we're familiar with the exercise files, now we can start creating our responsive experience.

Contents