Join Chris Converse for an in-depth discussion in this video Updating the detail content, part of Create an Interactive Map with jQuery.
- View Offline
Now in our map.js file after the addClass statement we go outside of our click function.…Let's hit a few Returns. And so what I want to do is start off by creating a variable.…The variable is going to be named city. We're going to set that equal to,…two tick marks for string literal. We're going to type city_detail and a…pound sign to represent an ID and then outside of the string literal I'm going…to type a plus sign, and I'm going to type $(this).attr(),…string literal inside of the attribute parentheses, the word 'city', then a semicolon.…
So what we're doing with this city variable here is we're setting up a string…that's going to target the city detail with an ID of whatever city name value…matches the ID inside of the city detail, and this relates to all of the IDs in…the hidden HTML that matches the city attributes.…So with that variable setup, next line let's type a second variable.…We're going to call this htmlCode. htmlCode is going to = $() then the…variable city that we've just created.…
Take a look at the finished web site here.
- Preparing web graphics
- Creating the main container
- Manipulating links with CSS
- Adding a drop-down menu
- Downloading jQuery and adding interactivity to a project
- Creating city details
- Overriding click events of anchor tags with jQuery