jQuery hover()

Let's invoke a function on the jQuery hover() event!
We're completing these tasks in Submlime and the console.

Button

This is an example of a hover function:

  $("mySelector").hover(function() {
    // hover in statement
  }, function() {
    // hover out statement
  });

The button abovce has an ID of button.

  1. Open the js/008.4-jquery.js file in Sublime Text. It should have a ready() function.
  2. Inside the ready() function, add the function above using the selector #button.
  3. Add the code console.log("hovering button"); inside the hover in handler of the hover function.
    • Hint: Add your code after the // hover in statement
  4. Add the code console.log("not hovering button"); inside the hover out handler of the hover function.
    • Hint: Add your code after the // hover out statement
  5. Save the js/008.4-jquery.js file and refresh this page in your browser.
  6. Hover in and out of the button above. In the console, you should see hovering button and not hovering button when those events occur.

jQuery Docs hover()