How can I create a interactive page | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 1

How can I create a interactive page

I want to make a page with buttons that can take you to a new page

7th Sep 2020, 9:32 AM
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active)
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active) - avatar
8 Answers
+ 3
Make a button with onclick function <button onclick="showAboutPage()">About Page</button> JAVASCRIPT: // first grab the two divs (about and home) let home = document.querySelector("#home") let about = document.querySelector("#about") functionshowAboutPage() { home.style.display = "none" about.style.display = "block" // Making about div visible and home div invisible through javascript.r } similarly create a showHomePage function and do the opposite in it.
7th Sep 2020, 11:57 AM
maf
maf - avatar
+ 4
You can create an <a> </a> tag You give an attribute inside <a href="./about.html">ABOUT PAGE</a> This is a link, when someone clicks on it he would be taken to the about page, of course you can customise the styles of <a> tag so that it can look like a button. Some examples of styles: a { text-decoration: none; padding:20px; color:white; background-color: #242424; border-radius: 20px; } This wouldn't work on sololearn though, cuz you can't make multiple html files linked to each other here, so you gotta make some sections inside only one file, and give each section an id or class, make a button, which when clicked toggles the display property of sections.
7th Sep 2020, 11:16 AM
maf
maf - avatar
+ 4
Kintu Michael Evans bruh? How much more would i explain, search on youtube "DOM Manipulation" and see the courses from Traversy Media and The Net Ninja.
7th Sep 2020, 7:47 PM
maf
maf - avatar
+ 3
Kintu Michael Evans your code has <a href = "#"> which means its gonna take you nowhere.
7th Sep 2020, 11:20 AM
maf
maf - avatar
+ 2
Thanks
8th Sep 2020, 9:21 AM
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active)
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active) - avatar
+ 1
Ok can you format my code
7th Sep 2020, 11:18 AM
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active)
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active) - avatar
+ 1
Ok now what can I do to improve it
7th Sep 2020, 11:21 AM
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active)
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active) - avatar
+ 1
Explain more
7th Sep 2020, 12:49 PM
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active)
🥇👩‍💻 Kintu Michael Evans 🔥🔥( Active) - avatar