From 507afc7d0db86f5988e510634d422f0a254659e6 Mon Sep 17 00:00:00 2001 From: Joshmclemore Date: Tue, 8 Feb 2022 18:04:40 -0600 Subject: [PATCH 1/4] Finally accomplished 2 working changes. 8 more to go. --- src/index.js | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/src/index.js b/src/index.js index 13e4739cdd..73d1ada9b8 100644 --- a/src/index.js +++ b/src/index.js @@ -1,3 +1,27 @@ import './less/index.less' // Your code goes here! + +// Selecting Elements to change +const navButtons = document.querySelectorAll(".nav a"); +console.log(navButtons); +const title = document.querySelector("h1"); +const introImg = document.querySelector(".intro img"); + +// Creating Events with .addEventListener + +// function greyBackground() { +// EventTarget.style.color = 'grey' +// } + +// navButtons.addEventListener("mouseover", greyBackground); + +navButtons.forEach(element => { + element.addEventListener('mouseover', (event) => { + event.target.style.backgroundColor = 'lightgrey';} +)}); + +title.addEventListener('click', event => { + title.textContent += ` Is Taking Off!!`; +}) + From 20b77092b26289a2123a38a15e5eec4f338a3c03 Mon Sep 17 00:00:00 2001 From: Joshmclemore Date: Tue, 8 Feb 2022 18:41:30 -0600 Subject: [PATCH 2/4] Added two more events, for a total of 4 --- src/index.js | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/index.js b/src/index.js index 73d1ada9b8..49bb70ccf1 100644 --- a/src/index.js +++ b/src/index.js @@ -1,3 +1,4 @@ + import './less/index.less' // Your code goes here! @@ -25,3 +26,18 @@ title.addEventListener('click', event => { title.textContent += ` Is Taking Off!!`; }) +introImg.addEventListener('dblclick', function (event){ + introImg.style.border = '5rem'; +}) + +window.addEventListener('load', (event) => { + console.log('Good job loading'); + }); + +const source = document.querySelector('div.source'); + +source.addEventListener('copy', (event) => { + const selection = document.getSelection(); + event.clipboardData.setData('text/plain', selection.toString().toUpperCase()); + event.preventDefault(); +}); \ No newline at end of file From 4b3984aad40d08942081c295abe93e91014c7db6 Mon Sep 17 00:00:00 2001 From: Joshmclemore Date: Tue, 8 Feb 2022 19:34:17 -0600 Subject: [PATCH 3/4] I have completed 9 out of 10 events --- src/index.js | 65 +++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 59 insertions(+), 6 deletions(-) diff --git a/src/index.js b/src/index.js index 49bb70ccf1..1b3685f13c 100644 --- a/src/index.js +++ b/src/index.js @@ -22,22 +22,75 @@ navButtons.forEach(element => { event.target.style.backgroundColor = 'lightgrey';} )}); +// click title.addEventListener('click', event => { title.textContent += ` Is Taking Off!!`; }) +// dblclick introImg.addEventListener('dblclick', function (event){ introImg.style.border = '5rem'; }) +//load on my own window.addEventListener('load', (event) => { console.log('Good job loading'); }); -const source = document.querySelector('div.source'); +// keydown +window.addEventListener('keydown', evt => { + if (evt.key == 6){ + document.body.innerHTML = '

Sent to File 13

' + } +}) + +// Load +window.onload = function (evt) { + const heading = document.querySelector('h1') + heading.textContent = 'READY TO GO' + +// Copy + window.addEventListener('copy', () => { + navigator.clipboard.readText() + .then(text => { + heading.textContent += text + }) + }) + + document.body.addEventListener('click', evt => { + evt.target.classList.toggle('mirror') + }) + +// mousemove + +document.body.addEventListener('mousemove', evt => { + const {clientX, clientY} = evt + console.log(`mouse is at ${clientX}, ${clientY}`) +}) + +// mouseenter + +// mouseleave + +const destinations = document.querySelectorAll('.destination') +for (let destination of destinations) { + destination.addEventListener('mouseenter', () => { + destination.style.fontWeight = 'bold' + }) + destination.addEventListener('mouseleave', () => { + destination.style.fontWeight = 'initial' + }) +} + + +} + + +// Prevent Default -source.addEventListener('copy', (event) => { - const selection = document.getSelection(); - event.clipboardData.setData('text/plain', selection.toString().toUpperCase()); - event.preventDefault(); -}); \ No newline at end of file +Array.from(document.links).forEach(link => { + link.addEventListener("click", function(evt) { + evt.preventDefault(); + console.log(`The ${evt.target.textContent} link doesn't work, but I'm sure glad you came.`) + }) +}) \ No newline at end of file From cb93bfdb90c841c41ab6de0679f4ba129c79bcf6 Mon Sep 17 00:00:00 2001 From: Joshmclemore Date: Wed, 9 Feb 2022 09:15:11 -0600 Subject: [PATCH 4/4] Added a scroll event for my tenth event --- src/index.js | 31 +++++++++++++++++++++---------- 1 file changed, 21 insertions(+), 10 deletions(-) diff --git a/src/index.js b/src/index.js index 1b3685f13c..d757e55c0c 100644 --- a/src/index.js +++ b/src/index.js @@ -22,22 +22,22 @@ navButtons.forEach(element => { event.target.style.backgroundColor = 'lightgrey';} )}); -// click +// click - 1 title.addEventListener('click', event => { title.textContent += ` Is Taking Off!!`; }) -// dblclick +// dblclick - 2 introImg.addEventListener('dblclick', function (event){ introImg.style.border = '5rem'; }) -//load on my own +//load on my own - 3 window.addEventListener('load', (event) => { console.log('Good job loading'); }); -// keydown +// keydown - 4 window.addEventListener('keydown', evt => { if (evt.key == 6){ document.body.innerHTML = '

Sent to File 13

' @@ -49,7 +49,7 @@ window.onload = function (evt) { const heading = document.querySelector('h1') heading.textContent = 'READY TO GO' -// Copy +// Copy - 5 window.addEventListener('copy', () => { navigator.clipboard.readText() .then(text => { @@ -61,16 +61,16 @@ window.onload = function (evt) { evt.target.classList.toggle('mirror') }) -// mousemove +// mousemove - 6 document.body.addEventListener('mousemove', evt => { const {clientX, clientY} = evt console.log(`mouse is at ${clientX}, ${clientY}`) }) -// mouseenter +// mouseenter - 7 -// mouseleave +// mouseleave - 8 const destinations = document.querySelectorAll('.destination') for (let destination of destinations) { @@ -86,11 +86,22 @@ for (let destination of destinations) { } -// Prevent Default +// Prevent Default - 9 Array.from(document.links).forEach(link => { link.addEventListener("click", function(evt) { evt.preventDefault(); console.log(`The ${evt.target.textContent} link doesn't work, but I'm sure glad you came.`) }) -}) \ No newline at end of file +}) + + +// scroll - 10 +let last_known_scroll_position = 0; +window.addEventListener('scroll', function(event) { + last_known_scroll_position = window.scrollY; + console.log(last_known_scroll_position) + if (last_known_scroll_position >= 950){ + alert("That's All Folks") + } +}); \ No newline at end of file