Join Chris Converse for an in-depth discussion in this video Showing and hiding dots based on continent selection, part of Create an Interactive Map with jQuery.
Now that our change function is paying attention to that form, what we are…going to do here is instead of having an alert, we are going to change the state of the dots.…So inside of the alert, let's come in here and select the $('#mapForm…option:selected').val(). Let's cut that.…Let's get rid of the alert statement, and instead let's type var for variable.…And let's type selectedContinent.…So var selectedContinent = and let's paste in that statement and…then put a semicolon at the end.…
So we're now creating a variable called selectedContinent that's going to equal…the value of the option that's selected inside of the mapForm.…Let's hit a few Returns.…Let's start by typing a conditional statement.…So, if, beginning and ending parentheses, beginning and ending bracket.…Let's split the brackets open.…Inside of the if statement, we are going to say selectedContinent ==, two single…quotes for a string literal, ALL. If the selectedContinent menu item equals…ALL, which is the last item in the option menu which says show all continents.…
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