menu jquery en utilisant slideToggle() légère question

Question

Iv créé un menu coulissant vertical de base qui peut être vu ici sur la barre verticale grise gauche:

http://www.switchcreative.co.uk/tuckagefinewines/

Lorsque vous cliquez sur un pays, les sous-menus glissez vers le bas et le signe + de niveau supérieur devient un - mais comment le changer pour + quand le menu est à nouveau fermé. Je suppose que je veux ajouter un mouvement vers le haut même pour slidetoggles? mais je ne sais pas comment. J'ai essayé d'utiliser une instruction if pour le changer mais n'a pas pu obtenir de travailler ici est ma version plus proche de la façon de travailler comme Id:

function initMenu() { 
$('#menu ul:not(.active)').hide(); 
$('#menu li a.top_a').click(
function(e) { 
    e.preventDefault(); 
    $(this).next().slideToggle('normal'); 
    $(this).siblings('.plus').replaceWith(' - '); 
    } 
); 
} 

Answer 1

vous supprimez l'essai span.plus la définition du texte comme celui-ci:

if($(this).siblings('.plus').text() == '+') 
    $(this).siblings('.plus').text('-'); 
else 
    $(this).siblings('.plus').text('+'); 

Answer 2

Vous pouvez vérifier la hauteur CSS de chaque sous-élément. S'il est supérieur à 0, votre .plus-element devrait être remplacé par un "+". slideToggle() ne fait rien d'autre que changer la hauteur de l'élément en. Vous pouvez lire à ce sujet here

Answer 3

Modifier cette ligne:

$(this).siblings('.plus').replaceWith(' - '); 

à:

if($(this).siblings('.plus').length > 0){ 
    $(this).siblings('.plus').removeClass('.plus').addClass('.minus').text(' - '); 
} 
else { 
    $(this).siblings('.minus').removeClass('.minus').addClass('.plus').text(' + '); 
} 

Ou même avoir deux travées:

<span class="plus"> + </span><span class="minus"> - </span> 

.plus est visible et .minus est display: none;. Ensuite, lorsque vous basculez l'élément suivant, faites juste:

$(this).siblings('.plus, .minus').toggle();