how to create multiple html pages in "sololearn's playground"? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 6

how to create multiple html pages in "sololearn's playground"?

I am thinking of making a game and I need to make more than one page for the game, for example one page for menu which leads to the other page containing the game itself

8th May 2017, 4:04 PM
_Retr0/-
_Retr0/- - avatar
18 Answers
+ 9
e.g. <nav> <ul> <li><a href="_____">home</a</li> <li><a href="_____">page1</a></li> <li><a href="_____">page2</a></li> <li><a href="_____">page3</a></li> <li><a href="_____">page4</a></li> </ul> </nav> then you can style out with CSS
8th May 2017, 4:20 PM
PureLogicality
PureLogicality - avatar
+ 6
You could make a navigation bar or at least a few links
8th May 2017, 4:18 PM
PureLogicality
PureLogicality - avatar
+ 6
so do you know the answer @abdel
8th May 2017, 5:34 PM
_Retr0/-
_Retr0/- - avatar
+ 6
Would make a function and make it disappear
8th May 2017, 7:22 PM
_Retr0/-
_Retr0/- - avatar
+ 6
alright but you can't link one playground to the other could ya?
8th May 2017, 7:25 PM
_Retr0/-
_Retr0/- - avatar
+ 5
but how ? 🤔
8th May 2017, 4:19 PM
_Retr0/-
_Retr0/- - avatar
+ 5
my bad thx anyway
8th May 2017, 4:45 PM
_Retr0/-
_Retr0/- - avatar
+ 5
bruh maybe there isnt
8th May 2017, 7:22 PM
_Retr0/-
_Retr0/- - avatar
+ 5
already done that @abdel ;) var page1 = document.getElementById("page1").style.display = "none"; var main_page = document.getElementById("main_page").style.display = "initial"; function change2pg1() { var main_page = document.getElementById("main_page").style.display = "none"; var page1 = document.getElementById("page1").style.display = "initial"; }
8th May 2017, 7:30 PM
_Retr0/-
_Retr0/- - avatar
+ 5
no worries @abdel
9th May 2017, 4:59 AM
_Retr0/-
_Retr0/- - avatar
+ 4
@raithen can u code an example for me?
8th May 2017, 4:21 PM
_Retr0/-
_Retr0/- - avatar
+ 2
Just google 'Javascript Screen Manager', you'll find something. I don't have time right now, sorry. Hope that helps.
8th May 2017, 4:33 PM
Raithen
Raithen - avatar
+ 2
interesting question @Retro
8th May 2017, 5:31 PM
Abdel
Abdel - avatar
+ 2
Sorry @Retro , but I spent 20 minutes or more trying to find out out how
8th May 2017, 7:18 PM
Abdel
Abdel - avatar
+ 2
I created a function to make the text disappear when on clicked it but didn't work . please give time and I'll find out how in the next 24hrs (insha Allah )
8th May 2017, 7:27 PM
Abdel
Abdel - avatar
+ 1
One option is to write a screen-manager function that calls addClass to collection of elements (or 'page') and removes the class from the current elements. Thus, showing the new page, and hiding the old page. The pages start with opacity=0 and the class you add has opacity=1.
8th May 2017, 4:20 PM
Raithen
Raithen - avatar
+ 1
@Retro , almost the same as I did . keep taking it serious , I'll do in my part
8th May 2017, 7:33 PM
Abdel
Abdel - avatar
+ 1
finally I got it but still working on it . I'll post it for you tomorrow @Retro
9th May 2017, 12:03 AM
Abdel
Abdel - avatar