2012-03-27 2 views
0

Je naviguais depuis un moment et je suis encore à trouver une réponse pertinente. Je veux mes divs cachés qui sont tous de la même classe à slidetoggle, mais quand l'un glisse l'autre qui est ouvert ferme. Aussi je veux que l'information de spectacle/cacher l'information seulement pour changer pour le div qui est basculé.Jquery Slidetoggle div diviseurs multiples

Voici mon html

<p> 
    <a class="opener" href="javascript:slideTogle();">Click Here For Information</a> 
</p> 
<div class="content"> 
    <p>If you are looking to purchase your first home, reduce your existing monthly 
     repayments, pay off you mortgage early, raise cash for home improvements 
     or to pay off debt or even buy a property to let out we are able to assist 
     and advise you from start to finish. We have access to a wide range of 
     lenders offering independent mortgages to suit you.</p> 
    <p>Your home may be repossessed if you do not keep up repayments on your 
     mortgage.</p> 
    <ul> 
     <li>First time Buyers</li> 
     <li>Remortgages</li> 
     <li>Capital raising</li> 
     <li>Debt Consolidation</li> 
     <li>Buy To Let</li> 
    </ul> 
</div> 

et voici mon javascript

$(document).ready(function() { 
    // put all your jQuery goodness in here. 
    $('.content').hide(); 
    $('.content.open').show(); 

    $('.opener').click(function() { 


     $(this).parent().next('.content').slideToggle(300, function() { 
      $(".opener").text($(this).is(':visible') ? "Hide Information" : "Click Here For Information"); 
     }); 
    }); 
}); 

Je suis nouveau à jquery/javascript mais j'ai une connaissance de base de php et une bonne connaissance du html/css .

grâce

+0

$ (document) .ready (function() {// mettre toute votre bonté jQuery ici var showText = 'Cliquez pour plus d'informations & # 9658.' var HideText = 'Cacher l'information et # 9660 '; \t $ (' content.open. ') show();. \t $ ('. ouvreur ') cliquez sur (function() { \t $ (this) .parent() suivant (..' .CONTENT ') slideToggle. (' slow '); // \t commutateur visibilité \t $ (this) .data (' is_visible », $ (ça!) .data ('is_visible')); \t // modifier le lien selon que l'élément est affiché ou caché \t $ (this) .html ((! $ (This) .data ('is_visible'))? showText: hideText); \t $ ('.parent, .child'). Hide(); \t}); – user1296747

Répondre

0

Comme this?

$(document).ready(function() { 
    // put all your jQuery goodness in here. 

    $('.opener').click(function (e) { 
     var $opener = $(this); 
     var $content = $opener.parent().next('.content');   

     e.preventDefault(); 

     $content.toggleClass('open').slideToggle(300, function(){ 
      $opener.text($content.hasClass('open')?"Hide Information":"Click Here For Information"); 
     }); 

    }); 
});​ 
+0

J'ai collé mon nouveau code dans le commentaire ci-dessous, le problème est maintenant que j'ai plusieurs div, en fermant un lors de l'ouverture du – user1296747

+0

sélectionné J'ai changé le code afin que tous les accordéons fonctionneraient indépendamment les uns des autres. – Sinetheta

+0

Il n'ouvre pas les div du tout en utilisant ce code. Votre aide est appréciée. – user1296747