<!DOCTYPE html> <html lang=\"en\"> <head> <meta charset=\"utf-8\"> <title>Image

ID: 3596377 • Letter: #

Question

<!DOCTYPE html>

<head>

<title>Image Gallery</title>

</head>

<body>

<main>

<h1>Image Gallery</h1>

<li><a href="images/casting1.jpg" title="Casting on the Upper Kings">Upper Kings</a></li>

<li><a href="images/casting2.jpg" title="Casting on the Lower Kings">Lower Kings</a></li>

<li><a href="images/fish.jpg" title="Catching on the South Fork">South Fork</a></li>

<li><a href="images/lures.jpg" title="The Lures for Catching">Lures</a></li>

</ul>

<h2 id="caption">Casting on the Upper Kings</h2>

</p>

</main>

</body>

</html>

main.css:

body {

font-family: Arial, Helvetica, sans-serif;

width: 420px;

margin: 0 auto;

padding: 20px;

border: 3px solid blue;

}

h1, h2, ul, p {

margin: 0;

padding: 0;

}

h1 {

padding-bottom: .25em;

color: blue;

}

h2 {

font-size: 120%;

padding: .5em 0;

}

li {

padding: 0 0.25em;

display: inline;

}

#caption, #gallery {

text-align: center;

}

I need this exercise to use the each() method

example:

$("#image_list a").each(function() { // the statements of the function
});

This is a beginner class, only the image_gallery.js needs added, please use event handlers.

Extra 8-2 Develop an Image Gallery application 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 of figure 8-14 Image Gallery Catching on the South Fork You'll find the HTML, CSS, and image files for this application in this folder: exercises extrach08image gallery You'll also find an empty JavaScript file named image gallery.js. You can add your code to this file 1. 2. In the JavaScript file, add an event handler for the ready event method 3. Use the each) 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 the href attribute of the a> element, and you can get the caption from the title attribute Add an event handler for the click event of each link. The function for this event handler should accept a parameter named evt. The jQuery code for this event handler should display the image and caption for the link that was clicked. In addition, it should use the evt parameter to cancel the default action of the link. Add a jQuery statement that moves the focus to the first link on the page when the page is loaded 4. 5.

Explanation / Answer

paste code in

image_gallery.js

Navigate

<!DOCTYPE html> <html lang=\"en\"> <head> <meta charset=\"utf-8\"> <title>Image

<!DOCTYPE html> <html> <body> <div ng-app=\"myApp\" ng-controller=\"customersCtr

Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.

<!DOCTYPE html> <html lang=\"en\"> <head> <meta charset=\"utf-8\"> <title>Image

Question

Explanation / Answer

Related Questions

Navigate