File tree Expand file tree Collapse file tree
Expand file tree Collapse file tree Original file line number Diff line number Diff line change 1+ <!DOCTYPE html>
2+ < html >
3+ < head >
4+ < title > Mouseover Event</ title >
5+ < script >
6+ window . addEventListener ( "load" , function ( ) {
7+ let list = document . getElementById ( "lane-list" ) ;
8+ list . addEventListener ( "mouseover" , function ( event ) {
9+ let element = event . target ;
10+ element . innerHTML += ">" ;
11+ console . log ( "target" , element ) ;
12+ } ) ;
13+ } ) ;
14+ </ script >
15+ </ head >
16+ < body >
17+ Mouseover Race
18+ < ul id ="lane-list ">
19+ < li > Lane 1</ li >
20+ < li > Lane 2</ li >
21+ < li > Lane 3</ li >
22+ </ ul >
23+ </ body >
24+ </ html >
Original file line number Diff line number Diff line change @@ -3,8 +3,27 @@ function init () {
33 const button = document . getElementById ( "liftoffButton" ) ;
44 const paragraph = document . getElementById ( "statusReport" ) ;
55
6- // Put your code for the exercises here.
6+ button . addEventListener ( 'click' , event => {
7+ document . getElementById ( "statusReport" ) . innerHTML = 'Houston! We have liftoff!' ;
8+ } ) ;
9+
10+ missionAbort . addEventListener ( "mouseover" , event => {
11+ event . target . style . backgroundColor = "red"
12+ } )
13+
14+ missionAbort . addEventListener ( "mouseout" , function ( event ) {
15+ event . target . style . backgroundColor = "" ;
16+ } ) ;
17+
18+ missionAbort . addEventListener ( "click" , event => {
19+ let response = window . confirm ( "Are you sure you want to abort the mission?" )
20+ if ( response ) {
21+ paragraph . innerHTML = 'Mission aborted! Space shuttle returning home'
22+ } ;
23+ } ) ;
724
825}
926
1027window . addEventListener ( "load" , init ) ;
28+
29+
You can’t perform that action at this time.
0 commit comments