Join Chris Converse for an in-depth discussion in this video Adding the drop-down menu form element, part of Creating an Interactive Map with jQuery.
Now we're going to add a form element into our project.…Let's come back out to the Code Snippets folder and let's open form.txt up in Aptana.…Inside of here we're going to copy all of this to the clipboard.…Let's switch over to index.html and after all of the dots and before the ending…div tag which closes the map container, let's hit Paste.…I'm going to select some lines here and hit Tab to format this.…So what we've added here is a form element. We have an ID and the name of mapForm. …We also have a class called form_continent that we're going to lock on…to position this in the lower left-hand corner.…
Inside of here we have the select item which gives us the drop-down menu and…this has the name and ID of continent and then we have all of the different…options inside up here.…The text inside of the option area is what the user sees, so these are all…of the continent names and the value are all of the two letter codes that…we're going to be using.…These values here also match the continent attributes we've added inside of each…
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