From 53751bbc9252f59738a6c8dc53ef05fd117f0234 Mon Sep 17 00:00:00 2001 From: nguyenpham207 Date: Mon, 19 Sep 2022 23:16:19 -0700 Subject: [PATCH 1/3] Fetch-seanpham --- index.css | 12 ++++++++++++ index.html | 18 +++++++++++++++++- 2 files changed, 29 insertions(+), 1 deletion(-) create mode 100644 index.css diff --git a/index.css b/index.css new file mode 100644 index 00000000..c2914309 --- /dev/null +++ b/index.css @@ -0,0 +1,12 @@ + +h1 { + color: red; + text-align: center; + +} +body { + background-color: aquamarine; +} +.Search { + text-align: center; +} \ No newline at end of file diff --git a/index.html b/index.html index 695897ea..777fcc89 100644 --- a/index.html +++ b/index.html @@ -3,9 +3,25 @@ + Hello Front-End +
+

Welcome To Reddit

+
+ + +
-

Hello Front-End

+ From cd262589db032dbe3085c68ffb1d982fabe78e56 Mon Sep 17 00:00:00 2001 From: nguyenpham207 Date: Mon, 26 Sep 2022 11:26:30 -0700 Subject: [PATCH 2/3] fetch finished --- index.html | 24 +++++++----------------- js.js | 29 +++++++++++++++++++++++++++++ 2 files changed, 36 insertions(+), 17 deletions(-) create mode 100644 js.js diff --git a/index.html b/index.html index 777fcc89..1b91ba74 100644 --- a/index.html +++ b/index.html @@ -4,24 +4,14 @@ - Hello Front-End + -
-

Welcome To Reddit

-
- - -
- +
+

Welcome To Reddit

+
+ + +
diff --git a/js.js b/js.js new file mode 100644 index 00000000..a56f373c --- /dev/null +++ b/js.js @@ -0,0 +1,29 @@ +let counter = 4 +const theImg = document.createElement('img') + +document.addEventListener('DOMContentLoaded', () => { + + fetch('https://www.reddit.com/search.json?q=pets+nsfw:no') + .then(res => res.json()) + .then(data => { + console.log(data) + function img() { + theImg.src = data.children[count].data.thumbnail + theImg.style.width = '300px' + + } + document.querySelector('#start').addEventListener('click', () => { + let interval = setInterval(() =>{ + img() + counter+=1 + },1500) + document.querySelector('#stop').addEventListener('click', () => { + counter = 4 + clearInterval(interval) + }) + }) + }) + .catch(error => { + console.log('Error',error) + }) +} ) From d0dc3064fec21f7d04394b861076f0217d2af5d1 Mon Sep 17 00:00:00 2001 From: nguyenpham207 Date: Mon, 10 Oct 2022 10:52:22 -0700 Subject: [PATCH 3/3] fixing --- index.css | 5 +++-- index.html | 1 + js.js | 8 +++++++- 3 files changed, 11 insertions(+), 3 deletions(-) diff --git a/index.css b/index.css index c2914309..0bc68d00 100644 --- a/index.css +++ b/index.css @@ -7,6 +7,7 @@ h1 { body { background-color: aquamarine; } -.Search { - text-align: center; +#window { + height: 400px; + width: 400px; } \ No newline at end of file diff --git a/index.html b/index.html index 1b91ba74..6d4f7171 100644 --- a/index.html +++ b/index.html @@ -10,6 +10,7 @@

Welcome To Reddit

+
diff --git a/js.js b/js.js index a56f373c..9af07fc9 100644 --- a/js.js +++ b/js.js @@ -1,6 +1,7 @@ let counter = 4 const theImg = document.createElement('img') + document.addEventListener('DOMContentLoaded', () => { fetch('https://www.reddit.com/search.json?q=pets+nsfw:no') @@ -9,7 +10,11 @@ document.addEventListener('DOMContentLoaded', () => { console.log(data) function img() { theImg.src = data.children[count].data.thumbnail - theImg.style.width = '300px' + theImg.style.width = '400px' + theImg.style.height= '400px' + const window = document.getElementById('window') + window.appendChild(theImg) + } document.querySelector('#start').addEventListener('click', () => { @@ -18,6 +23,7 @@ document.addEventListener('DOMContentLoaded', () => { counter+=1 },1500) document.querySelector('#stop').addEventListener('click', () => { + theImg.src="" counter = 4 clearInterval(interval) })