Week 8 Notes

Listening for Other Events

Window Scroll

We can listen for the window scroll event as follows:

We can also grab the current scroll position using $(window).scrollTop().

Window Resize

We can listen for the window resize event as follows:

And we can use $(window).width() and $(window).height() to grab the current width and height of our viewport.

Mousemove

Fires every time the mouse moves:

The Event Object

The event object contains many variables and functions that we may want to use in our program, the most common of which are as follows:

pageX, pageY

The mouse position at the time the event occurred, relative to the top left corner of the page display area (not the entire browser window).

which

The button or key that was pressed.

target

The DOM element that initiated the event.

timeStamp

The difference in milliseconds between the time the event occurred in the browser and January 1, 1970.

preventDefault()

Prevent the default action of the event (e.g. following a link).

stopPropagation()

Stop the event from bubbling up to other elements.

🔙 Go Home

Last updated: March 11, 2020