Servus,
hab gestern ein Grundloyaut gebastelt.
Ein div (orange) wird beim onclick über 90% der Fläche gestreckt.
Die anderen divs werden beim onclick wieder hervorgehoben.
Soweit funktioniert das in allen Browsern bis auf den IE.
Könnte mir ein JS-Profi nen Tip geben an was es liegt?
gruß
Tolonath
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
<!--
html, body {
background-color: black;
margin: 0;
padding: 0;
height: 100%; /* WICHTIG!!! STRECKT ANZEIGENBEREICH AUF 100% */
}
.game {
position:absolute; top:0%; right:60%; bottom:90%; left:0%;
background-color: orange; z-index:1;
}
.game:hover {
background-color: white;
}
.links {
position:absolute; top:10%; right:60%; bottom:30%; left:0%;
background-color: red;
}
.mitte {
position:absolute; top:0%; right:40%; bottom:30%; left:40%;
background-color: blue;
}
.rechts {
position:absolute; top:0%; right:0%; bottom:30%; left:60%;
background-color: green;
}
.unten {
position:absolute; top:70%; right:0%; bottom:0%; left:0%;
background-color: yellow;
}
-->
</style>
<script language="JavaScript">
<!--
function vor (was) {
var ind=0;
var indo=0;
for (i=0; i<5;i++)
{ indo = eval(document.getElementsByTagName("div")[i].style.getPropertyValue("z-index"));
if (ind <= indo) {
ind = indo;
}
}
ind=ind+1;
document.getElementsByName(was)[0].style.zIndex = ind;
}
function game () {
vor ("game");
document.getElementsByName("game")[0].style.width = "90%";
document.getElementsByName("game")[0].style.height = "90%";
document.getElementsByName("game")[0].style.right = "0%";
document.getElementsByName("game")[0].style.left = "0%";
document.getElementsByName("game")[0].style.bottom = "";
document.getElementsByName("game")[0].style.marginLeft = "auto";
document.getElementsByName("game")[0].style.marginRight = "auto";
document.getElementsByName("game")[0].style.top = "0%";
document.getElementsByName("links")[0].style.top = "0%";
}
//-->
</script>
</head>
<body style="background-color:blue" bgcolor="red" >
<div id="game" class="game" name="game" onclick='game()'>Game</div>
<div id="links" class="links" name="links" onclick="vor('links')">links</div>
<div id="mitte" class="mitte" name="mitte" onclick="vor()">mitte</div>
<div id="rechts" class="rechts" name="rechts" onclick="vor('rechts')">rechts</div>
<div id="unten" class="unten" name="unten" onclick="vor('unten')">unten</div>
</body>
</html>