lauxx/jqueryvacation

##jQuery Project

##Purpose The purpose of this day project is practice setting up an HTML/CSS Site and manipulating the DOM by use of jQuery. The student will get an opportunity to slide, fadeIn, hide, and append components through the use of event listeners.

##Directions

• Fork and clone this repository.

• Take some time to look over this terrible looking vacation site. Notice that there are several places of opportunity for the use of jQuery. The menu button, the scam button, the list of links, the arrows for sliding the images, and even the images themselves offer opportunity to play around with jQuery.

• When you are ready, using script tags, call in the jQuery library using its CDN. Also, be sure to connect the app.js file using script tags.

• In the app.js file, start by verifying that the document is ready and has been completely loaded by using an event listener. It should look something like this.

$(document).ready(function() {
    //This is where you will put your code to manipulate your components.
});

• Now, as for styling and DOM manipulation, that is completely up to you. I am merely providing you with ideas and suggestions. So please, make use of jQuery to accomplish whatever it is you would like to do to this site. And most importantly have fun!

##Ideas

• Creating a menu, so that you can slideToggle in a menu bar when the menu button has been clicked.

• When you click on the scam button "Click Here", have a small animated dancing man pop up.

• By clicking on the Useful Links element, toggle between showing and hiding the actual links.

• When you click either of the arrows next to the images, have the images fade off the screen and have new ones fade in from the opposite side.

• When you click on the images, have a modal pop up explaining the vacation destinations a bit further, or have the images flip around so you can see the backside where text can be visible.

• If you incorporate an exit button on the images, it can remove the image or replace it with another image.

-Do as much as you like. Get creative. Have fun!

##More practice If you need more practice, take the weekend, and create a game using jQuery. If you need help there are many tutorials online in terms of creating simple games using jQuery.

##Copyright

(c) Montana Code School, 2016.