Starting with the downloadable assignment files, write theJavascriptneeded for the application. Use the book and lectures as a guide. In this exercise, you’ll develop an Image Gallery application that displays different images when the user clicks on the links at the top of the page. This works like the Image Swap application below.
1.You’ll find the HTML, CSS, and image files for this application in the week 6 folder
You’ll also find an empty JavaScript file named image_gallery.js. You can add your code to this file. Customize the interface with your first and last names.
2.In the JavaScript file, add an event handler for theready() event method.
3.Use theeach() method to run a function for each element in the unordered list of items. Then, add jQuery code that gets the URL and caption for each image and preloads the image. You can get the URL from thehrefattribute of the element, and you can get the caption from the title attribute.
4.Add an event handler for the click event of each link. The function for this event handler should accept a parameter namedevt. The jQuery code for this event handler should display the image and caption for the link that was clicked. In addition, it should use theevtparameter to cancel the default action of the link.
5.Add a jQuery statement that moves the focus to the first link on the page when the page is loaded.
Create a document and paste in JS and/or HTML. Comment each code section with a detailed description of what it does. Zip all files, including images, for submission. Add a screenshot of the running application on your computer showing the time/date on your screen at the time of testing.