Avatar billede kasbas91 Nybegynder
30. oktober 2010 - 11:34 Der er 7 kommentarer og
1 løsning

Hej jeg har et problem med noget jquery,... Jeg aner ikke hvordan man kan lukke det igen ved at klikke undenfor...

Hej eksperten.dk jeg har et problem med noget jquery,... Jeg aner ikke hvordan man kan lukke det igen ved at klikke undenfor...




        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script type="text/javascript">
        var mouse_is_inside = false;
        $(document).ready(function() {
            $('#EmLogind').click(function() {
                $('#EmLogind_Toggler').fadeIn();
                $("#EmLogind").addClass("btnToggler").fadeIn();
                $("#EmLogind_Toggler").css("display", "block");
            });
        });
        </script>


                <div id="EmLogind"><a href="#"></a></div>
                <div id="EmLogind_Toggler" style="display: none;">
                    <p>Velkommen</p>
                </div>


Jeg vil gerne have at man kan klikke udenfor for at lukke den...

Hvis i forstår mig.. Eller klikke på iconet igen som er EmLogind

for at lukke den...

I kan se det her: http://empresa.prowdesign.dk/empresa.php

Klik på nøglen... Tak.
Avatar billede nolan1337 Nybegynder
30. oktober 2010 - 13:17 #1
Prøv at køre det her kode på document.ready:

var state = false;

$('#EmLogind').click(function(e) {
    e.stopPropagation();
    if(!state) {
        $('#EmLogind_Toggler').fadeIn();
        $("#EmLogind").addClass("btnToggler").fadeIn();
        $("#EmLogind_Toggler").css("display", "block");
        state = true;
    }
   
});

$(document).click(function() {
    if(state) {
        $('#EmLogind_Toggler').fadeOut();
        state = false;
    }
});

$('#EmLogind_Toggler').click(function() {
    return false
});
Avatar billede nolan1337 Nybegynder
30. oktober 2010 - 13:19 #2
Det kan godt være at du skal have deklarationen af state variablen ud og være global. Så den står udenfor document.ready funktionen.
Avatar billede kasbas91 Nybegynder
30. oktober 2010 - 13:24 #3
ja, men jeg er næsten lige startet på jquery, så hvad mener du med:

deklarationen af state variablen ud og være global.

;P
Avatar billede kasbas91 Nybegynder
30. oktober 2010 - 13:26 #4
Jeg har prøvet at gøre sådan her, men jeg kan ikke få den til at lukke den, når jeg klikker udenfor den...



        var state = false;
        $(document).ready(function() {
            $('#EmLogind').click(function(e) {
                e.stopPropagation();
                if(!state) {
                    $('#EmLogind_Toggler').fadeIn();
                    $("#EmLogind").addClass("btnToggler").fadeIn();
                    $("#EmLogind_Toggler").css("display", "block");
                }
             
            });
           
            $(document).click(function() {
                if(state) {
                    $('#EmLogind_Toggler').fadeOut();
                }
            });
           
            $('#EmLogind_Toggler').click(function() {
                return false
            });
        }); 

Avatar billede nolan1337 Nybegynder
30. oktober 2010 - 13:41 #5
Du skal lige have opdateringen af state med (sidste linie i de to if sætninger):

var state = false;
$(document).ready(function() {
       
    $('#EmLogind').click(function(e) {
        e.stopPropagation();
        if(!state) {
            $('#EmLogind_Toggler').fadeIn();
            $("#EmLogind").addClass("btnToggler").fadeIn();
            $("#EmLogind_Toggler").css("display", "block");
            state = true;
        }

    });

    $(document).click(function() {
        if(state) {
            $('#EmLogind_Toggler').fadeOut();
            state = false;
        }
    });

    $('#EmLogind_Toggler').click(function() {
        return false
    });
});
Avatar billede kasbas91 Nybegynder
30. oktober 2010 - 13:49 #6
Okay ja det virker perfekt, men kan man gøre det samme, altså når man vil lukke den, om kan kan lave sådan at man kan klikke igen på iconet, og den så lukker... eller sådan noget.. ;P
Avatar billede nolan1337 Nybegynder
30. oktober 2010 - 13:53 #7
Du kan tilføje følgende efter den første if sætning:

else {
    $('#EmLogind_Toggler').fadeOut();
    state = false;
}
Avatar billede kasbas91 Nybegynder
30. oktober 2010 - 13:57 #8
Okay rigtig mange mange tak.. ;P
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester