Avatar billede patrickreck Nybegynder
22. oktober 2011 - 13:50 Der er 1 kommentar og
1 løsning

JQuery begynder

Hejsa. Jeg er lige startet på noget javascript og jquery, og forstår ikke helt hvorfor dette script jeg har fået sat sammen ikke virker. Når man klikker første gang vil den gerne åbne paragraffen, men anden gang man klikker lukker den ikke.

<script>
$(function() {
    $('#main p').css({"display" : "none"});
   
    $('#main a.expand').click(function() {
        $('#main p').slideDown(400);
        $('a.expand').removeClass('expand').addClass('close');
    });
   
    $('#main a.close').click(function() {
        $('#main p').css({"display" : "none"});
    });

})
</script>

<style>
.expand {
    font-weight: bold;
}
.close {
    color: red;   
}
</style>

<div id="main">
    <h1>Lorem Ipsum</h1><a href="#" class="expand">Åben</a>
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
</div>

Jeg har fjernet de overflødige tags (body osv.) for øjets skyld.
Avatar billede patrickreck Nybegynder
22. oktober 2011 - 14:48 #1
Har nu også prøvet med følgende som heller ikke fungerer:

<script>
$(function() {
    $('#main p').css({"display" : "none"});

    var vis = 1;
   
    if (vis == 1) {   
        $('#main #aaben').click(function() {
            $('#main p').slideDown(400);
            vis = 0;
        });
    }
   
    if (vis == 0) {
        $('#main #aaben').click(function() {
            $('#main p').slideUp(400);
            vis = 1;
        });
    }
})
</script>
Avatar billede patrickreck Nybegynder
22. oktober 2011 - 15:26 #2
Fik det til at fungere :-)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery</title>
<script type="text/javascript" src="jquery.js"></script>

<script>

$(function() {
    $('#indhold').css({"display" : "none"});
    $('#luk').css({"display" : "none"});

    $('#aaben').click(function() {
        $('#indhold').slideDown(400);
        $('#aaben').css({"display" : "none"});
        $('#luk').css({"display" : "inline"});
    });

    $('#luk').click(function() {
        $('#indhold').slideUp(400);
        $('#luk').css({"display" : "none"});
        $('#aaben').css({"display" : "inline"});
    });
})

</script>

</head>

<body>

<div id="main">
    <h1>Lorem Ipsum</h1><a href="#" id="aaben">Åben</a> <a href="#" id="luk">Luk</a>
    <p id="indhold">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
</div>

</body>
</html>
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

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



Seneste spørgsmål Seneste aktivitet
I dag 20:46 opkaldside Af hagbartm i Mobiltelefoner
I dag 16:05 win 10 vil ikke boote Af bb69 i Windows
I dag 11:20 Lenovo x390 Af tobberjas i PC
I dag 10:14 Alder i Excel Af Nanarsi i Excel
I dag 09:00 Flere linier på faneblad Af Peder Lund Nielsen i Excel