Join Chris Converse for an in-depth discussion in this video Adding the content for the cities, part of Create an Interactive Map with jQuery and Dreamweaver.
- View Offline
Before we add additional city_detail information into the HTML of our file, I…want to go through and isolate all of our CSS rules.…So let's come over to the interactive_map.css file.…A lot of times when you are going to create an interactive component that goes…into somebody else's web site, you want to isolate all of your CSS rules, which…means we want to have every rule start with the name of our outermost container.…So in here I am going to select .map_container at the very top of the CSS rule,…copy this to the clipboard, and inside of this CSS I want to paste….map_container and space before each one of the different rules.…
This means that these rules will only take effect if they're inside of our….map_container. One before .form_continent.…I am going to add this before each one of the different classes.…Basically this is turning every one of these rules into a compound CSS rule.…
Now that we have .map_container in front of each one of these items, let's come…back to the index.html file.…
Take a look at the finished web site here.
- Preparing web graphics
- Preparing the base 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
- Enhancing the design with CSS3