Daniel: rollover link! (Bild verändern) für alle browser?

Beitrag lesen

<html>
<head>
<title>Rollover mit mehreren Bildern</title>
<script language="javascript" type="text/javascript">
function swapPictures(id, status)
{
    var rollover            =    new Array();

rollover[0]                =    new Array();
    rollover[0].standartURL    =    "rot.gif";
    rollover[0].rolloverURL    =    "gelb.gif";
    rollover[0].pictureID    =    "p1";
    rollover[0].chgID         =    new Array();
    rollover[0].chgID[0]    =    2;

rollover[1]                =    new Array();
    rollover[1].standartURL    =    "blau.gif";
    rollover[1].rolloverURL    =    "gruen.gif";
    rollover[1].pictureID    =    "p2";
    rollover[1].chgID         =    new Array();
    rollover[1].chgID[0]    =    1;

rollover[2]                =    new Array();
    rollover[2].standartURL    =    "gelb.gif";
    rollover[2].rolloverURL    =    "blau.gif";
    rollover[2].pictureID    =    "p3";
    rollover[2].chgID         =    new Array();
    rollover[2].chgID[0]    =    1;

rollover[3]                =    new Array();
    rollover[3].standartURL    =    "gruen.gif";
    rollover[3].rolloverURL    =    "rot.gif";
    rollover[3].pictureID    =    "p4";
    rollover[3].chgID         =    new Array();
    rollover[3].chgID[0]    =    2;
    rollover[3].chgID[1]    =    1;

rollover[4]                =    new Array();
    rollover[4].standartURL    =    "trigger.gif";
    rollover[4].rolloverURL    =    "trigger_over.gif";
    rollover[4].pictureID    =    "p5";
    rollover[4].chgID         =    new Array();
    rollover[4].chgID[0]    =    1;

rollover[5]                =    new Array();
    rollover[5].standartURL    =    "trigger.gif";
    rollover[5].rolloverURL    =    "trigger_over.gif";
    rollover[5].pictureID    =    "p6";
    rollover[5].chgID         =    new Array();
    rollover[5].chgID[0]    =    2;

for (var pictureIndex in rollover)
    {
        for(var idIndex in rollover[pictureIndex].chgID)
        {
            doRollover    =    (rollover[pictureIndex].chgID[idIndex] == id)
            if(doRollover)
            {
                break;
            }
        }
        if(doRollover&&status=="over")
        {
            var picIndex = rollover[pictureIndex].pictureID;
            document.images[picIndex].src = rollover[pictureIndex].rolloverURL;
        }
        else if(doRollover&&status=="out")
        {
            var picIndex = rollover[pictureIndex].pictureID;
            document.images[picIndex].src = rollover[pictureIndex].standartURL;
        }
        doRollover = false;
    }

}
</script>
</head>
<body>
<table>
    <tr>
        <td><img id="p1" src="rot.gif"></img></td>
        <td><img id="p2" src="blau.gif"></img></td>
        <td><img id="p3" src="gelb.gif"></img></td>
        <td><img id="p4" src="gruen.gif"></img></td>
    </tr>
    <tr>
        <td colspan="2">
            <p>Swap 1:<img id="p5" src="trigger.gif" onMouseOver="swapPictures(1, 'over')" onMouseOut="swapPictures(1, 'out')"></p>
        </td>
        <td colspan="2">
            <p>Swap 2:<img id="p6" src="trigger.gif" onMouseOver="swapPictures(2, 'over')" onMouseOut="swapPictures(2, 'out')"></p>
        </td>
    </tr>
</table>
</body>
</html>

so gehts! :-)