[Javascript] slideout menu *

[gebruikershaes]

Hallo,

Ik worstel al 2 uur met mijn slideout menu, maar krijg het niet voor elkaar met mijn 0,0 javascript kennis.

Ik heb een menu van het internet gehaald waarbij als je erop klikt de menu uitschuift en bij nog een klik die weer inschuift. Ik wil dat dit schuiven bij mouseover en mouseout gebeurt.

Het originele script:

JavaScript:

    $(document).ready(function() {
        $(".topMenuAction").click( function() {
            if ($("#openCloseIdentifier").is(":hidden")) {
                $("#slider").animate({ 
                    marginTop: "-170px"
                    }, 500 );
                $("#topMenuImage").html('<img src="open.png" alt="open" />');
                $("#openCloseIdentifier").show();
            } else {
                $("#slider").animate({ 
                    marginTop: "0px"
                    }, 500 );
                $("#topMenuImage").html('<img src="close.png" alt="close" />');
                $("#openCloseIdentifier").hide();
            }
        });  
    });

Wat ik ervan heb proberen te maken:

JavaScript:

    $(document).ready(function() {
        $(".topMenuAction").mouseover( function() {
            if ($("#openCloseIdentifier").is(":hidden")) {
                $("#slider").stop().animate({ 
                    marginTop: "-170px"
                    }, 500 );
                $("#topMenuImage").html('<img src="open.png" alt="open" />');
                $("#openCloseIdentifier").show();
            } else {
        $(".topMenuAction").mouseout( function() {
            if ($("#openCloseIdentifier").is(":hidden")) {
                $("#slider").stop().animate({ 
                    marginTop: "0px"
                    }, 500 );
                $("#topMenuImage").html('<img src="close.png" alt="close" />');
                $("#openCloseIdentifier").hide();
            }
        });  
    });

Hierbij geeft die bij de onderste regel een fout alsof ik een '}' ben vergeten, maar ik zie niet waar.

Wie o wie kan mij verder op weg helpen?

[ Voor 2% gewijzigd door MueR op 19-03-2010 14:11 ]

[Barleone]

wil je ajb je code tussen [code] tags zetten? Dat is beter leesbaar. Edit je post en klik boven het editvenster even op UBB codes als je niet begrijpt wat ik bedoel.

Daarnaast, heb je een voorbeeldpagina online staan, zodat mensen snel kunnen inzien wat je wilt bereiken?

[DaRKie]

Ten eerste: java =/= javascript

Ten tweede, met een beetje nette indenting kom je tot het volgende:

JavaScript:

$(document).ready(function() {
    $(".topMenuAction").mouseover( function() {
        if ($("#openCloseIdentifier").is(":hidden")) {
            $("#slider").stop().animate({marginTop: "-170px"}, 500 );
            $("#topMenuImage").html('<img src="open.png" alt="open" />');
            $("#openCloseIdentifier").show();
        } else {
            $(".topMenuAction").mouseout( function() {
                if ($("#openCloseIdentifier").is(":hidden")) {
                    $("#slider").stop().animate({marginTop: "0px"}, 500 );
                    $("#topMenuImage").html('<img src="close.png" alt="close" />');
                    $("#openCloseIdentifier").hide();
                }
            });
        }
    });
});

Je was dus 2x een } vergeten

[iivvvii]

gebruik jquery hover of hoverintent plugin

succes

[MueR]

Voor support op code van derden mag je contact opnemen met de maker. Zie WEB Beleid - Scriptrequests.

Verder: gebruik in het vervolg code tags alsjeblieft, dat scheelt een hoop in de leesbaarheid. Hoe post je code? / Hoe gebruik je de code tag?