dwarfdude77
In Runtime
- Messages
- 270
- Location
- USA
Hello everyone! I am making a text based game as a starter game for me using JavaScript. I had another post here ->http://www.techist.com/forums/f11/how-center-javascript-created-object-273413/ that has all of my previous questions. I have decided to just make a new post, as the other one was getting long and off-topic.
So, here is my first problem!
My blue button chain stops at the first line and won't go on to the next?
HTML:
CSS:
All of the JavaScript:
The specific Javascript:
Thanks always!
So, here is my first problem!
My blue button chain stops at the first line and won't go on to the next?
HTML:
Code:
<html>
<head>
<title> Lines of Story </title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="script.js"></script>
</head>
<body onload="buttonReady()">
<p id="main">Lines of Story <br> Presented by Cameron Palmer</p>
<div id="buttonDiv"class="buttonDiv"> </div>
<p id="button">
<button id="submit" align="middle" onclick="change()"> Press </button>
</p>
</body>
</html>CSS:
Code:
#main{text-align: center;}
#button{text-align: center;}
div.buttonDiv{text-align: center;}All of the JavaScript:
Code:
function buttonReady(){
var b= document.getElementById("submit");
var p= document.getElementById("main");
var d= document.getElementById("buttonDiv");
b.style.height="30px";
b.style.width="60px";
}
function change() {
var b= document.getElementById("submit");
var p= document.getElementById("main");
var d= document.getElementById("buttonDiv");
switch(p.innerHTML) {
default:
p.innerHTML="The end!";
break;
case "Lines of Story <br> Presented by Cameron Palmer":
p.innerHTML="This is a text-based game.";
break;
case "This is a text-based game.":
p.innerHTML="It will be very boring.";
break;
case "It will be very boring.":
p.innerHTML="It's made for old people and nerds.";
break;
case "It's made for old people and nerds.":
p.innerHTML="Ahh... text based games.";
break;
case "Ahh... text based games.":
p.innerHTML="Chapter 1<br>Which color do you like more?";
var redbtn = document.createElement("BUTTON");
var redtext = document.createTextNode("Red");
redbtn.appendChild(redtext);
d.appendChild(redbtn);
redbtn.style.color="red";
redbtn.className="redbtn";
var bluebtn = document.createElement("BUTTON");
var bluetext = document.createTextNode("Blue");
bluebtn.appendChild(bluetext);
d.appendChild(bluebtn);
bluebtn.style.color="blue";
bluebtn.className="bluebtn";
b.style.display="none";
redbtn.style.width="60px";
redbtn.style.height="30px";
bluebtn.style.width="60px";
bluebtn.style.height="30px";
bluebtn.onclick= blueFunction;
redbtn.onclick= redFunction;
break;
function blueFunction() {
bluebtn.style.display="none";
redbtn.style.display="none";
var bluesubmit = document.createElement("BUTTON");
var bluesubmitext = document.createTextNode("Press");
bluesubmit.appendChild(bluesubmitext);
d.appendChild(bluesubmit);
bluesubmit.style.color="blue";
bluesubmit.style.width="60px";
bluesubmit.style.height="30px";
switch(p.innerHTML){
case "Chapter 1<br>Which color do you like more?":
p.innerHTML="So... blue?";
break;
case "So... blue?":
p.innerHTML="I always hated blue.";
break;
case "I always hated blue.":
p.innerHTML="(Sniffle) <br> It... it makes me sad.";
break;
}
}
function redFunction() {
bluebtn.style.display="none";
redbtn.style.display="none";
var redsubmit = document.createElement("BUTTON");
var redsubmitext = document.createTextNode("Press");
redsubmit.appendChild(redsubmitext);
d.appendChild(redsubmit);
redsubmit.style.color="red";
redsubmit.style.width="60px";
redsubmit.style.height="30px";
switch(p.innerHTML) {
case "Chapter 1<br>Which color do you like more?":
p.innerHTML="Red...ah...red";
break;
}
}
}
}The specific Javascript:
Code:
function blueFunction() {
bluebtn.style.display="none";
redbtn.style.display="none";
var bluesubmit = document.createElement("BUTTON");
var bluesubmitext = document.createTextNode("Press");
bluesubmit.appendChild(bluesubmitext);
d.appendChild(bluesubmit);
bluesubmit.style.color="blue";
bluesubmit.style.width="60px";
bluesubmit.style.height="30px";
switch(p.innerHTML){
case "Chapter 1<br>Which color do you like more?":
p.innerHTML="So... blue?";
break;
case "So... blue?":
p.innerHTML="I always hated blue.";
break;
case "I always hated blue.":
p.innerHTML="(Sniffle) <br> It... it makes me sad.";
break;
}
}Thanks always!
