diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000000000000000000000000000000000000..7a73a41bfdf76d6f793007240d80983a52f15f97 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,2 @@ +{ +} \ No newline at end of file diff --git a/functions.js b/functions.js index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..8730a51b7b30a084bd10a23b9a96fe61a5d8cd19 100644 --- a/functions.js +++ b/functions.js @@ -0,0 +1,31 @@ +let slideNumber = 0; + +const newsImageSources = ['img/nasa_news_1.jpg', 'img/nasa_news_2.jpg', 'img/nasa_news_3.jpg']; +const newsTitles = ['Space Station', 'Earth', 'NASA Goddard']; +const newsSubtitles = ['Expedition 48 Crew Lands Safely on Earth', 'NASA Announces Summer 2023 Hottest on Record', 'NASA\'s Webb Snaps Supersonic Outflow of Young Star']; + +window.onload = onload(); + +function onload() { + console.log("Page loaded"); + + setInterval(slideImage, 30000); +} + +function slideImage() { + slideNumber = (slideNumber + 1) % 3; + + const slideImage = document.getElementById('slide-image'); + + const slideContainer = document.getElementById('slide-container'); + const slideTitle = slideContainer.children[0]; + const slideSubtitle = slideContainer.children[1]; + + let newsImageSource = newsImageSources[slideNumber]; + let newsTitle = newsTitles[slideNumber]; + let newsSubtitle = newsSubtitles[slideNumber]; + + slideImage.src = newsImageSource; + slideTitle.textContent = newsTitle; + slideSubtitle.textContent = newsSubtitle; +} \ No newline at end of file diff --git a/img/astronaut_landing.jpg b/img/nasa_news_1.jpg similarity index 100% rename from img/astronaut_landing.jpg rename to img/nasa_news_1.jpg diff --git a/img/nasa_news_2.jpg b/img/nasa_news_2.jpg new file mode 100644 index 0000000000000000000000000000000000000000..5ac2761093365706b9b17ed8268b42d82f4f8a1b Binary files /dev/null and b/img/nasa_news_2.jpg differ diff --git a/img/nasa_news_3.jpg b/img/nasa_news_3.jpg new file mode 100644 index 0000000000000000000000000000000000000000..da2350bd39f3336fc5fa9de1d8371c90bd2aec26 Binary files /dev/null and b/img/nasa_news_3.jpg differ diff --git a/index.html b/index.html index c442491c1ee7406332e2d0bad0969b5130e9b479..0d5d7552a4ddba391e982972be0a8e6611d2891e 100644 --- a/index.html +++ b/index.html @@ -8,7 +8,7 @@ <script src="https://kit.fontawesome.com/yourcode.js" crossorigin="anonymous"></script> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> - <body> + <body onload=""> <header> <img class="nasa-img" src="img/nasa.png" /> @@ -50,10 +50,10 @@ <div class="article-content-container"> <a class="article-link" href="#"></a> - <img class="article-image" src="img/astronaut_landing.jpg" /> + <img id="slide-image" class="article-image" src="img/nasa_news_1.jpg" /> <div class="article-content"> - <div class="news-headline"> + <div id="slide-container" class="news-headline"> <h3>Space Station</h3> <h2>Expedition 48 Crew Lands Safely on Earth</h2> </div>