Listening on document/window
So far you've interacted with events emitted from a DOM element such as a
<button>, but what if you need to listen for global events?
Common global events include the
mousemove and the
Qwik has the
window: namespace prefixes which allow you to listen to global events.
Open the browser's console and move your mouse over the text in the sample. Notice how moving the mouse logs the mouse position to the console. This logging only happens while moving the mouse over the text because the event is wired on the
onMouseMove event. Attaching at this level stops event bubbling beyond the element's listener.
How would you adjust the code to log the mouse position at all times?
Change to a global listener by adding the
document: prefix to the
With this change, notice how moving the mouse anywhere on the application (even outside of the text) shows output in the console.Edit Tutorial