chrisdel101/signin-jquery-events

A simple test of jQuery events

Signin Screen

Complete these steps to create a signin prototype:

1. When the user presses the .signin button, fade in the modal window
2. When the user presses the .close button, fade out the modal window
3. When the user presses the .submit button, add an .error class to both input elements

$("input:checkbox[name='ProductCode']")

4. When the user puts their cursor in one of the input fields, remove the .error class
5. (Bonus) Allow the user to click the .modal to close itself

• Tricky, consider what happens when two elements that are overlapping are both waiting for a click

Things to consider:

• How do you select a CSS element by "name" attribute?
• Can you create the animation using just CSS? (you don't have to do it, just consider how)
• If both input elements have the same functionality, can they share code?