Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
Hi! I am Chris Converse, and this is a course I am creating an interactive homepage marquee for your web site. I want to start by first showing the final project that we are going to be creating. Inside of the downloadable assets, inside of Final Project, I am going to open the index.html file. Opening this up inside of a web browser, what we have here is a preload on our project that we will go through and download all of the images and make sure they are all loaded. Once it's loaded, the image will fade up and our caption will slide into place. We have these buttons down here that will automatically generate based on the HTML markup.
We do need it least IE7 so that we can have the transparency in the caption area here. Likewise, let's jump over to Windows 7, and let's take a look at the same project running in IE9, which shipped just a few weeks ago. Click on the buttons, photos, slide, all the transparency is in place. In addition, we can also look at our project running across different devices as well. So if we take a look over at the Android platform and I come in here to Google, take a look at the same project, I am going to hold Ctrl+F11 to rotate this device.
So I am going to take the index file, open it up in a text editor, and I am going to quickly come in and take the content from the second caption and just add two more sets of content here, so I've basically tripled the size of this particular object. Let's go back to our browser. Let's hit Reload. Now when I want go to slide 2, the content is going to slide up two-thirds taller to accommodate all the different content and then slide back down. In addition, the HTML when it gets initialized, is going to count, using jQuery, the number of panels that we need as well.
So I can add or remove panels by simply adding or removing HTML in our source document. So I hope this project sounds interesting, and if so, let's get started with the first chapter.
There are currently no FAQs about Create an Interactive Homepage Marquee with jQuery and Dreamweaver.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.