adding web prototypes of last week

jargonbot
manetta 5 years ago
parent 2ff6b3c084
commit 67d0645367

@ -0,0 +1,13 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Iframe 1</title>
</head>
<style>
body{
background-color: yellow;
}
</style>
<body>
Hello
</body>
</html>

@ -0,0 +1,13 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Iframe 2</title>
</head>
<style>
body{
background-color: pink;
}
</style>
<body>
world
</body>
</html>

@ -0,0 +1,13 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Iframe 3</title>
</head>
<style>
body{
background-color: orange;
}
</style>
<body>
!
</body>
</html>

@ -0,0 +1,19 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Iframes</title>
</head>
<style>
body{
background-color: lightgrey;
}
iframe{
width: 30%;
display: inline-block;
}
</style>
<body>
<iframe src="iframes.1.html"></iframe>
<iframe src="iframes.2.html"></iframe>
<iframe src="iframes.3.html"></iframe>
</body>
</html>

@ -0,0 +1,14 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Redirect 1</title>
<meta http-equiv="refresh" content="0;URL='meta-refresh.2.html'" />
</head>
<style>
body{
background-color: yellow;
}
</style>
<body>
<p>You will be redirected to <a href="meta-refresh.2.html">meta-refresh.2.html</a>.</p>
</body>
</html>

@ -0,0 +1,14 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Redirect 2</title>
<meta http-equiv="refresh" content="0;URL='meta-refresh.3.html'" />
</head>
<style>
body{
background-color: pink;
}
</style>
<body>
<p>You will be redirected to <a href="meta-refresh.3.html">meta-refresh.3.html</a>.</p>
</body>
</html>

@ -0,0 +1,14 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Redirect 3</title>
<meta http-equiv="refresh" content="0;URL='meta-refresh.1.html'" />
</head>
<style>
body{
background-color: orange;
}
</style>
<body>
<p>You will be redirected to <a href="meta-refresh.1.html">meta-refresh.1.html</a>.</p>
</body>
</html>

@ -0,0 +1,33 @@
# Networked exercises
## webring:
https://en.wikipedia.org/wiki/Webring
* ringsurf
https://web.archive.org/web/19980612213331/http://www.ringsurf.com/
https://web.archive.org/web/19980612213413/http://www.ringsurf.com:80/wm.html (FAQ)
* Webringo
http://webringo.com/index.php
http://webringo.com/browsering.php?id=137
http://a-womans-web.serennau.co.uk/
## iframes:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
*Because each browsing context is a complete document environment, every <iframe> in a page requires increased memory and other computing resources. While theoretically you can use as many <iframe>s as you like, check for performance problems.*
## redirections:
* Olia Lialina - http://art.teleportacia.org/olia/summer/ (uses javascript)
* meta-refresh prototype (but confusions, security risks, bad functioning of back button)

@ -0,0 +1,45 @@
<!doctype html>
<!-- drx -->
<head>
<meta charset="utf8">
<title></title>
<script type="text/javascript">
var chain = [["http://1x-upon.com/~despens/olia/summer/"], ["http://www.newrafael.com/olia/summer/", "http://www.entropy8.com/olia/summer/"], ["http://saskia-aldinger.com/olia/summer/"], ["http://www.sebastianschmieg.com/olia/summer/"], ["http://GLI.TC/H/olia/summer/", "http://www.constantdullaart.com/olia/summer/"], ["http://jonaslund.biz/olia/summer/"], ["http://thxalot.org/olia/summer/"], ["http://www.raquelmeyers.com/olia/summer/"], ["http://www.anthonyantonellis.com/olia/summer/"], ["http://www.emiliegervais.com/olia/summer/"], ["http://kimasendorf.com/olia/summer/"], ["http://shorttermmemoryloss.com/olia/summer/"], ["http://todayandtomorrow.net/olia/summer/"], ["http://benfinoradin.info/olia/summer/"], ["http://www.leegte.org/olia/summer/"], ["http://www.faithholland.com/olia/summer/", "http://fernandoalfonso.com/olia/summer/"], ["http://www.evan-roth.com/olia/summer/"], ["http://k0a1a.net/olia/summer/"]];
var step = 1;
var branch_initial = branch = Math.floor(Math.random()*chain[step].length);
window.onload = function(){
setTimeout(function(){
top.location = chain[step][branch];
}, 150);
setInterval(function(){
branch++;
if(branch == chain[step].length) branch = 0;
if(branch == branch_initial) {
branch_initial = branch = 0;
step++;
if(step == chain.length) step = 0;
}
top.location = chain[step][branch]
}, 3000)
}
</script>
<style type="text/css">
body {
margin: 0;
padding: 0;
background: white;
background: -webkit-linear-gradient(-90deg, blue, white);
background: linear-gradient(to bottom, blue, white);
background-repeat: repeat-x;
background-size: 100% 330px;
}
img {
display: block;
margin: 0 auto;
}
</style>
</head>
<body>
<img src="olia01.gif" width="146" height="374">
</body>
Loading…
Cancel
Save