master
*anna* 4 years ago
parent cefb698fd6
commit 541d45799a

BIN
.DS_Store vendored

Binary file not shown.

BIN
tree/.DS_Store vendored

Binary file not shown.

@ -1,18 +0,0 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>start</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<iframe name="news" src="http://cnn.com/"></iframe>
<a href="http://repubblica.it" target="news">Read</a>
<script src="jquery.min.js"></script>
<script type="text/javascript" src="index.js" ></script>
</body>

BIN
tree/imgs/.DS_Store vendored

Binary file not shown.

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 324 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 201 KiB

@ -1,5 +1,5 @@
div.introtext { div.introtext {
font-size: 5vw;; font-size: 5vw;
} }
form { form {
@ -7,4 +7,22 @@ form {
} }
label { label {
display: inline; display: inline;
}
input#player_name {
/*
-webkit-appearance: none;*/
border: 4px black solid;
border-radius: 15px;
font-size: 4vw;
color: black;
}
button {
-webkit-appearance: none;
font-size: 4vw;
background-color: white;
border: 4px black solid;
border-radius: 15px;
color:black;
} }

@ -4,18 +4,19 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>welcome</title> <title>welcome</title>
<link rel="icon" href="imgs/icon_welcome.png"> <link rel="icon" href="imgs/avatars/ball2.gif">
<link rel="stylesheet" href="index.css"> <link rel="stylesheet" href="index.css">
</head> </head>
<body> <body>
<div class="introtext"> <div class="introtext">
welcome to *game_name*, in this story you will be someone called It looks like you have been summoned by the oracle (<img src="imgs/avatars/ball1.png" height="70px">,<img src="imgs/avatars/ball2.gif" height="70px">,<img src="imgs/avatars/ball4.gif" height="70px">).
You will be asked to start a journey: throughout it you will be called
<form name="nameForm"> <form name="nameForm">
<input id="player_name" type="text" placeholder="enter you name" > <input id="player_name" type="text" placeholder="enter you name" >
</form>.<br> </form>.
You can decide whether you are going to look like You can decide whether you are going to look like
<form id="avatar_form" > <form id="avatar_form" >
<input type="radio" id="player1" name="player_avatar" value="imgs/avatars/avatar1.gif"> <input type="radio" id="player1" name="player_avatar" value="imgs/avatars/avatar1.gif">
<label for="player1"><img id="player_img_1" src="imgs/avatars/avatar1.gif" height="70px"></label> <label for="player1"><img id="player_img_1" src="imgs/avatars/avatar1.gif" height="70px"></label>

@ -22,6 +22,25 @@ p.text_container {
} }
#newspaper_index{
position:fixed;
/* border: solid black 2px;*/
left:15%;
top:10%;
background-color: white;
z-index:30;
box-shadow: 10px 10px 15px black;
max-width: 30%;
font-size: 1vw;
}
.index_content{
margin: 5% 5% 5% 5% ;
}
/*images*/
#player_img { #player_img {
bottom: 22%; bottom: 22%;
left: 35%; left: 35%;

@ -9,7 +9,25 @@
</head> </head>
<body> <body>
<div id="groundline"></div> <div id="groundline"></div>
<div id="newspaper_index" style="display: none;">
<div class="index_content">
Juicy Local News<br><br>
News from the school:<br>
-----Our annual trip to the Spring River National Park <br><br>
suspected food poisoning at primary school
*<br>
*<br>
*<br>
*<br>
*<br>
*<br>
</div>
</div>
<div id="player_img"></div> <div id="player_img"></div>
<img id="bench" src="imgs/park/bench1.gif" height="160px"> <img id="bench" src="imgs/park/bench1.gif" height="160px">
<img id="tree1" src="imgs/park/tree1.gif" height="300px"> <img id="tree1" src="imgs/park/tree1.gif" height="300px">
@ -25,7 +43,7 @@
<img id="flower2" src="imgs/park/flower2.gif" height="50px"> <img id="flower2" src="imgs/park/flower2.gif" height="50px">
<p class="text_container"> Hello <span id="player_name"> </span>. It's Saturday morning. You are at the park waiting for your friend Amanda. She seems to be really late. <p class="text_container"> Hello <span id="player_name"> </span>. It's Saturday morning. You are at the park waiting for your friend Amanda. She seems to be really late.
You spot a copy of today's newspaper on the bench close to you. Maybe you want to <a href="1_newspaper.html">give it a read</a>. You can <a href="1_walk.html">go for a little walk</a> or just <a href="1_amanda.html">wait for Amanda</a> if you feel like it. </p> You spot a copy of today's newspaper on the bench close to you. Maybe you want to <button id="open_newspaper_index">give it a read</button>. You can <a href="1_walk.html">go for a little walk</a> or just <a href="1_amanda.html">wait for Amanda</a> if you feel like it. </p>
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
@ -40,7 +58,9 @@
//get player name from local storage //get player name from local storage
document.querySelector('#player_name').innerHTML =localStorage.playerName; document.querySelector('#player_name').innerHTML =localStorage.playerName;
$("#open_newspaper_index").click (function(){
$("#newspaper_index").toggle();
});
</script> </script>

Loading…
Cancel
Save