You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
71 lines
2.4 KiB
HTML
71 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<title>start</title>
|
|
<link rel="stylesheet" href="style_1.css">
|
|
|
|
</head>
|
|
<body>
|
|
<!-- <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 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 little walk</button>.
|
|
<button>Just relax</button> there if you feel like it .
|
|
</div>
|
|
|
|
|
|
<div id="2_park_newspaper" style="display: none;">
|
|
<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">
|
|
<option value="1">read it</option>
|
|
<option value="2">read it</option>
|
|
<option value="3">read it</option>
|
|
<option value="4">read it</option>
|
|
</select>
|
|
-->
|
|
</div>
|
|
<div id="2_park_walk" style="display:none">
|
|
<button id="switchTo1_walk">(back)</button> You are walking...
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="gardenSpace" style="display:none">
|
|
<div id="pane">
|
|
<div id ="square">
|
|
<img src="gifs/walking.gif">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="papers">
|
|
|
|
<div id="readme_1" style="display: none;">
|
|
<iframe width="300px" height="250px" src="readme/readme_1.html" title="read me"></iframe>
|
|
</div>
|
|
<div id="readme_2" style="display: none;">
|
|
<iframe width="300px" height="400px"src="readme/readme_2.html" title="read me"></iframe>
|
|
</div>
|
|
<div id="readme_3" style="display: none;">
|
|
<iframe width="300px" height="200px" src="readme/readme_3.html" title="read me"></iframe>
|
|
</div>
|
|
<div id="readme_4" style="display: none;">
|
|
<iframe width="300px" height="200px" src="readme/readme_4.html" title="read me"></iframe>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
|
<script type="text/javascript" src="script.js" ></script>
|
|
|
|
</body> |