Sixerkarton
Grünschnabel
Hi,
ich such jetzt schon eine geschlagene Stunde und habe nichts passendes in den Weiten des Webs gefunden, ich hoffe ihr könnt mir helfen.
Ich möchte die class eines Div's mit hover bzw. onmouseover ändern.
Das Problem darin besteht, dass mir folgender Code:
im IE 7 undefined und im FF [object HTMLDIVElement] gibt.
mein Seiten Code sieht so aus:
hatte das ganze zuerst mit CSS und hover versucht und dann wollte ich es mit JS machen, aber beides klappt nicht.
Kann wer helfen?
Danke im Voraus
Sixer
ich such jetzt schon eine geschlagene Stunde und habe nichts passendes in den Weiten des Webs gefunden, ich hoffe ihr könnt mir helfen.
Ich möchte die class eines Div's mit hover bzw. onmouseover ändern.
Das Problem darin besteht, dass mir folgender Code:
Code:
alert(window.document.getElementsByName('colorDiv')[0]);im IE 7 undefined und im FF [object HTMLDIVElement] gibt.
mein Seiten Code sieht so aus:
Code:
<html>
<head>
<style>
body { background-color:#FFF5E0; }
* { color:black; font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 10px; font-weight:bold }
#color:hover
{
border: #ff2cbc 1px solid;
cursor:pointer;
cursor:hand;
}
#checked
{
border: #ff2cbc 1px solid;
}
</style>
<script type="text/javascript">
<!--
function Over(No)
{
window.document.getElementsByName('colorDiv')[No].id = 'checked';
}
function Leave(No)
{
window.document.getElementsByName('colorDiv')[No].id = 'color';
}
function SetColor(val)
{
for(i=0;i<8;i++)
window.document.getElementsByName("colorDiv")[i].id = 'color';
window.document.getElementsByName('colorDiv')[val].id = 'checked';
window.document.getElementsByName("color")[0].value = val;
//= "border: #0000A0 1px solid;";
}
-->
</script>
</head>
<body>
<center>
<form action="create.php" method="get">
<table border="0">
<tr>
<td>Welt:</td>
<td><select size="1" name="world">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</td>
</tr>
<tr>
<td>
Username:
</td>
<td>
<input type="text" value="" name="user"> *
</td>
</tr>
<tr>
<td>
Hintergrund Bild (URL):
</td>
<td>
<input type="text" value="" name="pic">
</td>
</tr>
<tr>
<td>
Text-Farbe:
</td>
<td>
<table>
<tr>
<td>
<div id="color" name="colorDiv" style="background: #ff0000;" onclick="javascript:SetColor(0);"> </div>
</td>
<td>
<div id="color" name="colorDiv" style="background: #ffffff;" onclick="javascript:SetColor(1);"> </div>
</td>
<td>
<div id="checked" name="colorDiv" style="background: #000000;" onclick="javascript:SetColor(2);"> </div>
</td>
<td>
<div id="color" name="colorDiv" style="background: #0000ff;" onclick="javascript:SetColor(3);"> </div>
</td>
</tr>
<tr>
<td>
<div id="color" name="colorDiv" style="background: #00ff00;" onclick="javascript:SetColor(4);"> </div>
</td>
<td>
<div id="color" name="colorDiv" style="background: #ffff00;" onclick="javascript:SetColor(5);"> </div>
</td>
<td>
<div id="color" name="colorDiv" style="background: #808080;" onmouseout="Leave(6);" onmouseover="Over(6);" onclick="javascript:SetColor(6);"> </div>
</td>
<td>
<div id="color" name="colorDiv" style="background: #ffa500;" onclick="javascript:SetColor(7);"> </div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<input type="hidden" value="2" name="color">
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="Absenden">
</td>
</tr>
</table>
</form>
Felder mit * müssen ausgefüllt werden
</center>
</body>
</html>hatte das ganze zuerst mit CSS und hover versucht und dann wollte ich es mit JS machen, aber beides klappt nicht.
Kann wer helfen?
Danke im Voraus
Sixer
