<html>
<script>
function expand() { document.getElementById("bar").style.height = "100%"; }
function collapse() { document.getElementById("bar").style.height = "0px"; }
function myFunction() {
if (document.getElementById('bar').clientHeight == 0) { expand(); }
else { collapse(); }
}
</script>
<LINK href="style.css" rel="stylesheet" type="text/css">
<title>TC Automotives</title>
<style>
#b1:hover {
background-image: url("resources/car.png");
}
#b2:hover {
background-image: url("resources/sketch.png");
}
#b3:hover {
background-image: url("resources/cogs.png");
}
#b4:hover {
background-image: url("resources/track.png");
}
</style>
<body>
<div id="menu">
<div id="buttonholder">
<div id="b1" class="button" onclick="myFunction()">Models</div>
<div id="b2" class="button" onclick="myFunction()">Design</div>
<div id="b3" class="button" onclick="myFunction()">Details</div>
<div id="b4" class="button" onclick="myFunction()">Specifications</div>
</div>
<div id="eagle"></div>
<div id="senna"></div>
</div>
<!--div id="logo"></div-->
<div id="wrapper">
<!--div id="wrapper2"></div><div id="dropshadowbg"></div-->
<div id="bar">
<div class="bottombox">
<div class="bs">
ASDadsasddas
</div>
</div>
</div>
</div>
</body>
</html>