master
*anna* 3 years ago
parent eadb276e93
commit 241bbda50e

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>readme</title>
<link rel="stylesheet" href="../style_1.css">
</head>
<body class="readme">
<div>message 1</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="../script.js" ></script>
</body>

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>readme</title>
<link rel="stylesheet" href="../style_1.css">
</head>
<body class="readme">
<div>message 2</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="../script.js" ></script>
</body>

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>readme</title>
<link rel="stylesheet" href="../style_1.css">
</head>
<body class="readme">
<div>message 3</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="../script.js" ></script>
</body>

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>readme</title>
<link rel="stylesheet" href="../style_1.css">
</head>
<body class="readme">
<div>message 4</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="../script.js" ></script>
</body>

@ -1,29 +1,40 @@
///////////////////////////////
// all jQuery stuff here
// all jQuery stuff here
$(document).ready(function() {
$("#trigger").click(function() {
$("#demo").html("Hello, World!");
$(document).on('click', '#paper_1', function(){
$("#readme_1").show();
});
$(document).on('change', 'select', function(){
alert($(this).find('option:selected').text());
$(document).on('click', '#paper_2', function(){
$("#readme_2").show();
});
$(document).on('click', '#paper_3', function(){
$("#readme_3").show();
});
$(document).on('click', '#paper_4', function(){
$("#readme_4").show();
});
});
//go back+go forward buttons
});;
/*go back+go forward buttons
function goBack() {
window.history.back();
}
function goForward() {
window.history.go(1);
}
*/
@ -33,4 +44,8 @@ $(document).ready(function() {
document.getElementById("container").innerHTML = document.getElementById(param_div_id).innerHTML;
}
function goBack(){
document.getElementById("2_park_newspaper").style.visibility = "hidden";
}

@ -20,27 +20,39 @@
<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.
Maybe you want to
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>
<button id="trigger">Click me</button>
<p id="demo"></p>
-->
</div>
</div>
<div id="papers">
<div id="readme_1" style="display: none;">
<iframe width="400px" height="250px" src="readme/readme_1.html" title="read me"></iframe>
</div>
<div id="readme_2" style="display: none;">
<iframe width="400px" height="500px"src="readme/readme_2.html" title="read me"></iframe>
</div>
<div id="readme_3" style="display: none;">
<iframe width="400px" height="300px" src="readme/readme_3.html" title="read me"></iframe>
</div>
<div id="readme_4" style="display: none;">
<iframe width="400px" height="300px" src="readme/readme_4.html" title="read me"></iframe>
</div>
</div>
<div id="readme_1" style="display: none;">
<iframe src="https://pzwiki.wdka.nl/mediadesign/Main_Page" title="read me"></iframe>
></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="script.js" ></script>

@ -1,6 +1,6 @@
body {
background-color: black;
font: 22px monospace;
font: 18px monospace;
}
#container {
@ -14,4 +14,41 @@ body {
padding: 2% 2% 2% 2%;
margin-bottom: 2%;
}
}
/* iframes park */
#readme_1 {
position:absolute;
z-index: 0;
left: 13%;
top:5%;
}
#readme_2 {
position:absolute;
z-index: 1;
left: 25%;
top:15%;
}
#readme_3 {
position:absolute;
z-index: 2;
left: 40%;
top:25%;
}
#readme_4 {
position:absolute;
z-index: 3;
right:13%;
top:35%;
}
body.readme{
background-color: white;
color:red;
}

Loading…
Cancel
Save