yes

4 years ago · d52f88100f
parent 241bbda50e
commit d52f88100f
2 changed files with 26 additions and 27 deletions
--- a/script.js
+++ b/script.js
@ -18,34 +18,30 @@ $(document).ready(function() {
    $("#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
-  function goBack() {
-    window.history.back();
-  }
-  function goForward() {
-    window.history.go(1);
-  }
-  */
-
-
-
-//to switch divs inside the container div
+$("#switchTo2_walk").click (function(){ 
+  $("#2_park_walk").show();
+  $("#1_park").hide();
+});

-  function show(param_div_id) {
-    document.getElementById("container").innerHTML = document.getElementById(param_div_id).innerHTML;
-  }  
+  $("#switchTo1_walk").click (function(){ 
+    $("#2_park_walk").hide();
+    $("#1_park").show();
+});

-  function goBack(){
-  document.getElementById("2_park_newspaper").style.visibility = "hidden";

-  }
+});;

--- a/start.html
+++ b/start.html
@ -6,23 +6,24 @@
    
 </head>
 <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="goForward()">→</button>
+-->


 <div id="container">
 <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.
-    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 .
 </div>


 <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>.
 <!--
 <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>
 -->
 </div>
-
+<div id="2_park_walk" style="display:none">
+    <button id="switchTo1_walk">(back)</button> You are walking...
+</div>

 </div>