What is an Event?

[MUSIC] 0:00 Any time you interact with a web page, you generate all kinds of events, 0:04 whether you realize it or not. 0:08 An event is something you do on the web page like moving your mouse around, 0:10 scrolling or clicking a link. 0:14 Browsers listen for these events and can do something in response, 0:16 like open a larger version of a photo when you click on a thumbnail image. 0:19 When you interact with a web page, you may trigger thousands of these events. 0:23 And in most cases, the browser doesn't do anything special in response. 0:27 That is, unless we write JavaScript code that handles or responds to that event. 0:31 In fact, JavaScript was created to listen for events and respond to them. 0:36 So for example, you can write code that waits for a user to click a button and 0:40 then runs a function when that button is clicked. 0:44 Perhaps the function expands part of the page to reveal other elements or 0:46 sends information to a server. 0:50 There are many other events beside click events. 0:52 Users scroll, move their mice, touch and drag on their phones or 0:55 tablets or type, to name a few. 0:58 Each of these events has a name that browsers recognize. 1:00 For example, 1:04 there's the click event, which we've been working with in this course so far. 1:04 However, there are many others. 1:08 For starters, consider other things you can do with a mouse or trackpad. 1:10 Apart from clicking, you can double click, hold the button down, 1:14 lift the button up, move the pointer, hover it over an element and 1:17 move the pointer out of an element's area. 1:21 On smartphones and tablets, there are similar touch events. 1:24 A keyboard is another way of generating user events. 1:27 Some events aren't necessarily tied directly to a user's action though. 1:31 For example, the load event occurs when the browser has completely loaded all of 1:34 the HTML, CSS and JavaScript for the page. 1:39 These events are some of the more commonly used, but are by no means all of them. 1:42 If you'd like to read more about events, I've posted some links for 1:46 you in the teacher's notes. 1:49 Now that you know more about events, 1:51 it's time to see how they can trigger responses. 1:52 We know that JavaScript can run a function when an event occurs, but 1:55 how do we set this up? 1:59 To understand that, we'll take a closer look at functions and 2:00 JavaScript in the next video. 2:03