master
*anna* 4 years ago
parent 241bbda50e
commit d52f88100f

@ -18,34 +18,30 @@ $(document).ready(function() {
$("#readme_4").show(); $("#readme_4").show();
}); });
});; });;
$(document).ready(function() {
$("#switchTo2_newspaper").click (function(){
$("#2_park_newspaper").show();
$("#1_park").hide();
});
$("#switchTo1_news").click (function(){
$("#1_park").show();
$("#2_park_newspaper").hide();
$("#readme_1,#readme_2,#readme_3,#readme_4").hide();
});
/*go back+go forward buttons $("#switchTo2_walk").click (function(){
function goBack() { $("#2_park_walk").show();
window.history.back(); $("#1_park").hide();
} });
function goForward() {
window.history.go(1);
}
*/
//to switch divs inside the container div
function show(param_div_id) { $("#switchTo1_walk").click (function(){
document.getElementById("container").innerHTML = document.getElementById(param_div_id).innerHTML; $("#2_park_walk").hide();
} $("#1_park").show();
});
function goBack(){
document.getElementById("2_park_newspaper").style.visibility = "hidden";
} });;

@ -6,23 +6,24 @@
</head> </head>
<body> <body>
<!-- <img class="source-image" src="background_4.jpg" alt=""/> --> <!-- <img class="source-image" src="background_4.jpg" alt=""/>
<button onclick="goBack()"></button> <button onclick="goBack()"></button>
<button onclick="goForward()"></button> <button onclick="goForward()"></button>
-->
<div id="container"> <div id="container">
<div id="1_park" style="display: block;"> <div id="1_park" style="display: block;">
It's Sunday. You are sit on a bench in the park. Your friend seems to be really late. You need a way to kill time until she arrives. It's Sunday. You are sit on a bench in the park. Your friend seems to be really late. You need a way to kill time until she arrives.
You can either <button onclick="show('2_park_newspaper')">read a copy of today's newspaper</button> that someone left on the bench or <button>go for a walk</button>. You can either <button id="switchTo2_newspaper">read a copy of today's newspaper</button> that someone left on the bench or <button id="switchTo2_walk">go for a walk</button>.
<button>Just relax</button> there if you feel like it . <button>Just relax</button> there if you feel like it .
</div> </div>
<div id="2_park_newspaper" style="display: none;"> <div id="2_park_newspaper" style="display: none;">
You open the newspaper, willing to engage with some juicy local news. <br>Suddenly, some sheets of paper start to fall on the ground. <button id="switchTo1_news">(back)</button> You open the newspaper, willing to engage with some juicy local news. <br>Suddenly, some sheets of paper start to fall on the ground.
Maybe you want to <button id="paper_1">read</button>,<button id="paper_2">read</button>,<button id="paper_3">read</button>,<button id="paper_4">read</button>. Maybe you want to <button id="paper_1">read</button>,<button id="paper_2">read</button>,<button id="paper_3">read</button>,<button id="paper_4">read</button>.
<!-- <!--
<select name="sheets" id="sheets"> <select name="sheets" id="sheets">
@ -33,7 +34,9 @@ Maybe you want to <button id="paper_1">read</button>,<button id="paper_2">read</
</select> </select>
--> -->
</div> </div>
<div id="2_park_walk" style="display:none">
<button id="switchTo1_walk">(back)</button> You are walking...
</div>
</div> </div>

Loading…
Cancel
Save