On mouseover - En anderledes løsning.

Hej alle sammen.

Jeg er blevet inspireret til at lave en lidt anderledes løsning på den almindelige mouseover.

Istedet for at lade et andet billed erstatte det billed som der peges på, så ville jeg gerne lave en løsning hvor billedet er sat til grayscale og først ved mouseover, kommer billedets orginale farver til syne.

Der hvor jeg har set noget lignende ligger der bl.a. dette i starten :

<!--

    IMG.Icon{
        height:31px;
        width:31px;
            filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
            background-color : #FFFFFF;
    }

    IMG.Icon{
        height:31px;
        width:31px;
            filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
            background-color : #FFFFFF;
    }
-->

og længere nede i dokumentet finder jeg så :

function IconMouseOut(){
    this.className = parent.pointer == this.idx ? 'IconHighlight' : 'Icon';
   
}

function IconMouseOver(){
    document.getElementById('hdln').style.visibility = "visible";
    document.getElementById('hdln').innerHTML = this.txt;
    this.className = 'IconHighlight';
    window.status='';
    return true
}

function IconMouseDown(){
    this.className = 'IconHighlight';
    if(parent.pointer>0){
        if(document.getElementById( 'i' + parent.pointer ))
            document.getElementById( 'i' + parent.pointer ).className='Icon';
    }
    parent.pointer = this.idx;
    if( this.url!="" )
        document.Site.action = this.url;
    LoadPage( this.idx, this.idx );
}

Men jeg har lidt problemer med at "oversætte" det til noget som jeg kan bruge på min egen side.

En som vil hjælpe mig med at lave en opsætning, således at jeg kan 8-9 små billeder ved siden af hinanden som reagere som beskrevet og som hopper videre til et link når der trykkes på dem ?

Kim