Commit ce1c82b

committed

DOM-Events

1 parent 3fd3dc5 commit ce1c82bCopy full SHA for ce1c82b

File tree

+77

-0

lines changed

+77

-0

lines changed

Lines changed: 13 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,13 @@`
	`1`	`+h1 {`
	`2`	`+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;`
	`3`	`+}`
	`4`	`+`
	`5`	`+h2 {`
	`6`	`+ font-family: monospace;`
	`7`	`+}`
	`8`	`+`
	`9`	`+h4 {`
	`10`	`+ font-size: 40px;`
	`11`	`+ width: 200px;`
	`12`	`+ text-align: center;`
	`13`	`+}`

4.15 KB

Lines changed: 27 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,27 @@`
	`1`	`+<!DOCTYPE html>`
	`2`	`+<html lang="en">`
	`3`	`+`
	`4`	`+<head>`
	`5`	`+ <meta charset="UTF-8">`
	`6`	`+ <meta http-equiv="X-UA-Compatible" content="IE=edge">`
	`7`	`+ <meta name="viewport" content="width=device-width, initial-scale=1.0">`
	`8`	`+ <title>DOM Events</title>`
	`9`	`+ <link rel="stylesheet" href="css/style.css">`
	`10`	`+</head>`
	`11`	`+`
	`12`	`+<body>`
	`13`	`+ <h1>DOM Events</h1>`
	`14`	`+ <h2>Example One</h2>`
	`15`	`+ <h3 onclick="DisplayOne()" id="textOne">Click on this text!</h3>`
	`16`	`+ <h2>Example Two</h2>`
	`17`	`+ <button onclick="DisplayTwo()">The Time is</button>`
	`18`	`+ <p id="textTwo"></p>`
	`19`	`+ <h2>Example Three</h2>`
	`20`	`+ <button onclick="DisplayThree()">Click to see if Cookies are enabled or not</button>`
	`21`	`+ <p id="textThree"></p>`
	`22`	`+ <h2>Example Four</h2>`
	`23`	`+ <h4 id="hover" onmouseover="DisplayFour()">Hove Me</h4>`
	`24`	`+ <script src="script.js"></script>`
	`25`	`+</body>`
	`26`	`+`
	`27`	`+</html>`

Lines changed: 37 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,37 @@`
	`1`	`+let textOne = document.getElementById('textOne');`
	`2`	`+`
	`3`	`+function DisplayOne() {`
	`4`	`+ textOne.innerHTML = "OOPs!";`
	`5`	`+}`
	`6`	`+`
	`7`	`+let textTwo = document.getElementById('textTwo');`
	`8`	`+`
	`9`	`+function DisplayTwo() {`
	`10`	`+ textTwo.innerHTML = new Date();`
	`11`	`+}`
	`12`	`+`
	`13`	`+let textThree = document.getElementById('textThree');`
	`14`	`+`
	`15`	`+function DisplayThree() {`
	`16`	`+ var text = "";`
	`17`	`+ if (navigator.cookieEnabled == true) {`
	`18`	`+ text = "Cookies are enabled.";`
	`19`	`+ } else {`
	`20`	`+ text = "Cookies are not enabled.";`
	`21`	`+ }`
	`22`	`+ textThree.innerHTML = text;`
	`23`	`+}`
	`24`	`+`
	`25`	`+let hover = document.getElementById('hover');`
	`26`	`+`
	`27`	`+function DisplayFour() {`
	`28`	`+ let x = true;`
	`29`	`+ if (x == true) {`
	`30`	`+ hover.style.backgroundColor = '#00FF00';`
	`31`	`+ x = false;`
	`32`	`+ } else {`
	`33`	`+ hover.style.backgroundColor = 'white';`
	`34`	`+ x = true;`
	`35`	`+ }`
	`36`	`+`
	`37`	`+}`

Comments

(0)