Schönen Guten Tag ich bin grad dabei Javascript zu lehrnen.
Ich wollte ein kleine Übung schreiben die auch Funktioniert aller dings kann ich weder css noch Javascript auslagern da sonst der Ie nicht mehr mit spielt hätte da vieleicht wer ne Idee wie ich das beheben kann?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="test/basic.css"/>
<script type="text/javascript" src="test/breit.js"></script>
<script type="text/javascript">
var box = new Array();
box[0] = 'wrap1';
box[1] = 'wrap2';
box[2] = 'wrap3';
box[3] = 'wrap4';
var intStep = 5; // Schrittweite, um die das DIV in seiner Grösse geändert wird
var intDelay = 5; // Verzögerung in Millisekunden
var intMin = 0; // Min. Breite des DIVs
var intMax = 1000; // Max. Breite des DIVs
var guzti = 0 ;
var objDiv = 0 ;
function show(id)
{
for(i=0;i<box.length;i++)
{
document.getElementById(box[i]).style.width="0px";
}
if ( objDiv == 0 ) {
objDiv = document.getElementById(id);
}
if ( guzti == 0) {
guzti = document.getElementById(id).style.width;
setTimeout("styl()", intDelay)
}
}
function styl(id)
{
guzti = parseInt(guzti);
if (guzti < intMax) {
guzti = guzti+ intStep;
objDiv.style.width = guzti+"px";
if (guzti < intMax) {
setTimeout("styl()", intDelay)
}
else
{
objDiv = 0 ;
guzti = 0 ;
}
}
}
</script>
</head>
<body>
<form>
<select>
<option value="#"onclick="show('wrap1');">#Steckbrief####</option>
<option value="#"onclick="show('wrap2');">#Lebenslauf######</option>
<option value="#"onclick="show('wrap3');">#test######</option>
<option value="#"onclick="show('wrap4');">#ja######</option>
</select>
</form>
<div id="wrap1" style="display:block; width:0px; background-color:#09C; overflow:hidden;" >
inhaltkommthierrein
</div>
<div id="wrap2" style="display:block; width:100px; background-color:#09C; overflow:hidden;" >
inhaltkommthierrein
</div>
<div id="wrap3" style="display:block; width:0px; background-color:#09C; overflow:hidden;" >
inhaltkommthierrein
</div>
<div id="wrap4" style="display:block; width:0px; background-color:#09C; overflow:hidden;" >
inhaltkommthierrein
</div>
</body>
</html>