JSFiddle - React, Tailwind, and code Playground
by _bop
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<link href="tabs.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="tabs.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>testfile</title>
<meta name="tutor" content="Bob de Ruiter">
<meta name="author" content="Your Name">
<!-- Date: 2011-07-07 -->
</head>
<body>
<div id="container">
<div id="header">
<ul><li><a href="index.php">DSNR Home</a></li><li><a href="protect.php">Protection</a></li><li><a href="brain.php">Brainz!</a></li></ul>
</div>
<div id="content">
content
</div>
</div>
</body>
</html>
CSS
body {
margin: 12px -12px;
background-color: #003;
font-family: Arial, "MS Trebuchet", sans-serif;
font-size: 16px;
width:100%;
}
#container {
width: 800px;
margin-left: auto;
margin-right: auto;
}
#header {
width: 600px;
margin: 0 auto;
}
#content {
background-color: #FFF;
padding: 12px;
}
#header ul {
background-color: #566AAA;
margin:0;
}
JavaScript
if (document.addEventListener)
document.addEventListener("DOMContentLoaded", function(){ran=1; init()}, false)
else if (document.all && !window.opera){
document.write('<script type="text/javascript" id="contentloadtag" defer="defer" src="javascript:void(0)"><\/script>')
var contentloadtag=document.getElementById("contentloadtag")
contentloadtag.onreadystatechange=function(){
if (this.readyState=="complete"){
ran=1
init()
}
}
}
window.onload=function(){
setTimeout("if (!ran) init()", 0)
}
function init() {
el = function(q) {return document.getElementById(q)};
anchors = el("header").getElementsByTagName("a")
for (a=0;a<anchors.length;a++) {
if (anchors[a].href == window.location.href || anchors[a].href == window.location.href+"index.php") {
anchors[a].removeAttribute("href")
anchors[a].parentNode.className = "selected"
break;
}
}
}