[javascript] Scriptaculous Effect.Morph probleem

[Verwijderd]

Hoi Tweakers,

Ik heb hetvolgende probleem: Ik heb Effect.Morph toegevoegd aan mijn menuknoppen. Effect.Morph werkt goed, maar ligt nogal in de knoop met met onmouseover en onmouseout. Deze zijn ingevoegd in de <a>. (de kader) In deze <a></a> zit een img. Als ik daarover hover, spreekt hij een onmouseout en onmouseover aan, terwijl hij nog altijd in het <a> gebied zit. Ik had even gedacht om de <img>'s als achtergrond-afbeelding in te stellen, maar omdat die afbeeldingen uit een database moeten gefetched worden lijkt mij dit vrij onmogelijk of gekkenwerk.
Iemand suggesties?



Een vereenvoudige blik op het script in php:
ik heb de onmouseover en onmouseout even in een variabele gezet om het overzichtelijk te houden.

PHP:

        $overTest = "onmouseover=\"
                        new Effect.Morph('".$albumLinkId."', {
                        style: {
                        backgroundColor: '#ee4123',
                        color: '#ffffff'
                        },
                        duration: 0.2
                    });\"
                    onmouseout=\"
                        new Effect.Morph('".$albumLinkId."', {
                        style: {
                        backgroundColor: '#ffd966',
                        color: '#ee4123'
                        },
                        duration: 0.5
                    });\" ";
        
            
        
        //inhoud printen
    print '<a id="'.$albumLinkId.'" class="albumDiv '.$albumActive.' '.$albBG.'"
            '.$overTest.'
    href="mainpage.php?pagina=pictures&page=show-image&album=' . $row['al_id'] . '">
            <img class="fotoImg" src="./image-gallery/viewImage.php?type=album&name=' . $row['al_image'] . '">
            <br>
            ' . $row['al_name'] . '
            <br />
            ' . $numImages. '
            </a>';

Alvast bedankt voor jullie aandacht !

[-db-]

Ehm, wat heeft het feit dat de afbeeldingen uit een database moeten worden gehaald met het gebruik in achtergrond of in een img-tag te maken?

[Verwijderd]

ok, ik heb het gefixt.
Het ziet er al bij al nog redelijk overzichtelijk uit.

PHP:

        $backgroundStyle = "style=\"
                            background: url(./image-gallery/viewImage.php?type=album&name=" . $row['al_image'] . ");
                            background-repeat:no-repeat;
                            background-position: 12px 8px;
                            background-color: #ffd966;
                            \" ";
        
        
        //inhoud printen
    print '<a id="'.$albumLinkId.'" class="albumDiv '.$albumActive.' '.$albBG.'"
            '.$backgroundStyle.'
            '.$overTest.'
    href="mainpage.php?pagina=pictures&page=show-image&album=' . $row['al_id'] . '">
            
            <br>
            ' . $row['al_name'] . '
            <br />
            ' . $numImages. '
            </a>';

bedankt iedereen

[H004]

Mootools heeft hier overigens de mouseenter-event (op de pagina iets naar beneden scrollen) voor bedacht. De (on)mouseover wordt dan toegepast op het element én alle children, zodat jouw probleem niet plaatsvindt. Mouseleave werkt dan tzelfde als een normale (on)mouseout.

Ik heb even gezocht in de docs van scriptaculous, maar kan nog geen vergelijkbare functie vinden...