CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

MatsKruger Nybegynder

01. november 2011 - 12:22 Der er 8 kommentarer og
1 løsning

Jquery hasClass then hide

Hej
Jeg skal lave en menu i drupal ved hjælp af jquery
den skal kunne folde sig ud og ind, men når der er et aktivt link med class('active') skal den forblive udviddet

(function ($) {
$(document).ready(function() {
$('.region-sidebar-first .block-menu ul.menu').children().children().hasClass('active').hide();
$('.region-sidebar-first .block-menu h2').click(function() {
$(this).parent().siblings().children().next().children().slideUp(400);
$(this).next('.content').children('.menu').slideDown(400);
});
});
}(jQuery));

Synes godt om

jokkejensen Novice

01. november 2011 - 13:31 #1

Har du ikke noget markup, eller skal man gætte sig til det ?

og gerne et link så man kan se hvad det er du forsøger.

/J

Synes godt om

MatsKruger Nybegynder

01. november 2011 - 13:38 #2

Nu er det jo drupal tema så det er ikke helt min markup så ved ikke lige hvordan jeg skal sende markup til dig.
ved ikke om du kan bruge dette.
http://oi42.tinypic.com/15of4hy.jpg

Synes godt om

jokkejensen Novice

01. november 2011 - 13:43 #3

jo det er fint, så dem med et a med klassen active skal ikke rulle frem og tilbage ?

Synes godt om

kalp Novice

01. november 2011 - 14:10 #4

ved ikke om jeg har forstået det du vil have.. men det her?

og ellers.. kan du ikke paste din html fra din div med id "main" herind.. er for doven til at lave test html:)

(function ($) {
$(document).ready(function() {
$('.region-sidebar-first .block-menu ul.menu').children().children().hasClass('active').hide();
$('.region-sidebar-first .block-menu h2').click(function() {
if($(this).parent().find('a.active').length > 0) return;
$(this).parent().siblings().children().next().children().slideUp(400);
$(this).next('.content').children('.menu').slideDown(400);
});
});
}(jQuery));

Synes godt om

kalp Novice

01. november 2011 - 14:13 #5

mit eksempel er faktisk lidt forkert.. tjekket jeg har indført er vidst rigtigt nok hvis jeg forstod det du ville have, men jeg mangler at løbe siblings igennem.

Synes godt om

MatsKruger Nybegynder

01. november 2011 - 14:15 #6

Ja det er lige præcis det.
Håber virkeligt i kan hjælpe har siddet 6 timer med det nu og kan bare ikke få det til at virke.

Synes godt om

kalp Novice

01. november 2011 - 14:42 #7

Altså.. det at du kalder siblings forvirrer mig.. er det meningen kaldet skal påvirke alle divs med class "menu" ?

anyway.. her er et forslag:

<html>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.block-menu h2').click(function() {
if($(this).parent().find('a.active').length > 0) return;
$(this).parent().find('.menu').slideUp(400);
$(this).parent().find('.menu').slideDown(400);
});
});
</script>
</head>
<body>
<div>
<div class='block-menu'>
<h2>Menu 1</h2>
<div class='content'>
<ul class='menu'>
<li>
<a href="#" class="active">test 1</a>
</li>
</ul>
</div>
</div>
<div class='block-menu'>
<h2>Menu 2</h2>
<div class='content'>
<ul class='menu'>
<li>
<a href="#">test 2</a>
</li>
</ul>
</div>
</div>
<div class='block-menu'>
<h2>Menu 3</h2>
<div class='content'>
<ul class='menu'>
<li>
<a href="#">test 3</a>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>

Synes godt om

kalp Novice

01. november 2011 - 14:45 #8

hvis de skal påvirke hinanden kan du erstatte javascripten med:

$(document).ready(function(){
$('.block-menu h2').click(function() {
$('.block-menu').each(function() {
if($(this).find('a.active').length > 0) return;
$(this).find('.menu').slideUp(400);
$(this).find('.menu').slideDown(400);
});
});
});

og ja jeg benytter "find" men du kan bare rette det tilbage.. det her er bare hurtigere til test..

jeg er som sagt ikke helt med på hvad du vil, men mine kode eksempler gør da noget forskelligt om ikke andet xD måske kan de få dig i den rigtige retning.

Synes godt om

MatsKruger Nybegynder

02. november 2011 - 08:33 #9

Fandt selv en løsning
Men mange gange tak for hjælpen alligevel
(function ($) {
$(document).ready(function() {
$('.region-sidebar-first .block-menu ul.menu').hide();
$('.region-sidebar-first .block-menu ul.menu').find('a.active').parent().parent().show();
$('.region-sidebar-first .block-menu h2').click(function() {
$(this).parent().siblings().children().next().children().slideUp(400);
$(this).next('.content').children('.menu').slideDown(400);
});
});
}(jQuery));

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23
Ajax - indlæs webside og derefter hente data Af nemlig i JavaScript	4	21/05/202417:19	22/06/202422:07
Disable button efter 1. klik Af nemlig i JavaScript	2	05/05/202415:37	05/05/202416:25

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS