2010-11-11 8 views
1

J'ai écrit un script d'accordéon à déployer dans le site Web mobile, tout fonctionne bien. Cependant, je suis confronté à un problème lorsque la longueur de la page augmente.problème avec l'accordéon JQuery script

il y a environ 8 à 10 bars en accordéon. Lorsque je fais défiler vers le bas et que je clique sur n'importe quelle barre d'élément pour afficher le contenu, la page se déplace vers le haut au lieu de rester à la position actuelle sur laquelle j'ai cliqué.

S'il vous plaît me conseiller la solution.

ci-dessous est le script

$ ('de acc_container.') Hide(). $ ('.acc_container1'). Hide(); .

$ ('acc_trigger ') cliquez sur (function() { $ (this) .siblings() slideUp ('fast')' acc_container1..' $ (this) .parent() frères et sœurs. ('div'). children ('.acc_container1'). slideUp ('rapide'); $ (this) .parent(). siblings ('div'). children ('.acc_container'). slideUp ('rapide '); $ (this) .next() .sousblings (' .acc_container '). SlideDown (' rapide '); });

+0

est votre clic a href, s'il vous plaît poster le code, si elle est href vous avoir empêché par défaut .... – kobe

Répondre

1

Sur chacun des Trigge de votre accordéon rs qui affichent du contenu, que je suppose être des balises d'ancrage, vous devez empêcher le comportement par défaut de l'événement. Ce qui dans le cas des balises d'ancrage, est de vous prendre aussi l'attribut href de l'étiquette. Si l'attribut href est défini sur #, un clic sur la balise d'ancrage vous amènera en haut de la page. Donc, quelque chose comme ça devrait fonctionner, appeler preventDefault() sur l'objet event jQuery, en supposant .acc_trigger est le sélecteur pour tous vos accordian déclenche:

$(".acc_trigger").click(function(e) { 
    $(this).siblings('.acc_container1').slideUp('fast'); 
    $(this).parent().siblings('div').children('.acc_container1').slideUp('fast'); 
    $(this).parent().siblings('div').children('.acc_container').slideUp('fast'); 
    $(this).next().siblings('.acc_container').slideDown('fast'); 
    e.preventDefault(); 
}); 
1

Je suppose votre clic pourrait un clic href si oui

$("a").click(function(event) { 
// do all your logic here and add the below link 

event.preventDefault(); 

}); 

Si cela ne href

Donnez votre classe .acc_container une hauteur de jeu vous avez besoin comme 500px ou si, et un

height:600px; 
overflow: hidden; 

Cela devrait prendre Carek