jQuery: Toggling plusieurs choses avec un clic (noob)

Pardonnez-moi- Je n'aime pas ajouter aux questions de débutant sur ici, mais hélas, je suis coincé. J'essaie de faire glisser un tas de choses vers la gauche et hors de l'écran (y compris une image de fond), en basculant efficacement un panneau de contrôle (#navCol) et en agrandissant la zone principale (.main à .mainLarge).jQuery: Toggling plusieurs choses avec un clic (noob)

Cela fonctionne bien dans Firefox, mais pas dans IE. Je devrais noter que je suis débutant avec jQuery, mais pas avec html/css et l'arrangement courant de css semble mauvais mais ne peut pas être évité pour ce projet. Je soupçonne que ma jQuery est fausse, parce que dans IE chaque fois que j'appuie sur le lien à bascule, seulement certaines des animations se produisent. Lorsque vous cliquez à nouveau, d'autres le font.

Si je dois clarifier quelque chose, s'il vous plaît faites le moi savoir, et merci d'avance!

$('a#nav-toggle').click(function() { 
    $('#navCol').toggle('slide',400); 
    $('#main').toggleClass('mainLarge', 530); 
    $('body').toggleClass('backgroundOffset', 500); 
    return false; 
});

Est-ce exact? Voici le code html:

<body> 
<div id="horNav"> 
<ul id="navigation"> 
... 
</ul> 
</div> 
<div id="navCol"> 
Left Col 
</div> 
<div id="main" class="main"> 
Main Col 
<a href="#" id="nav-toggle"><-></a> 
</div> <!-- End main --> 
</body>

Et voici le css:

body { 
    background: #f1f1f1 url(/images/shadow.png) repeat-y top; 
    background-position: 400px 0px; 
} 

.backgroundOffset{ 
    background-position: 55px 0px; 
} 

#navCol{ 
    background: #eaeaea; 
    color: #000000; 
    height:100%; 
    left:0px; 
    margin-right:40px; 
    position:fixed; 
    top:0; 
    width:400px; 
    padding-top: 70px; 
} 

.main{ 
    padding-left: 460px; 
    padding-top: 100px; 
    padding-right: 100px; 
} 

.mainLarge{ 
    background-position: 55px 75px; 
    padding-left: 115px; 
}

Source

2010-01-29 James M

Quelle version d'IE? Je viens de mettre votre code dans un document et cela a fonctionné à la fois dans FF3.5 et IE7. – Erik

Encore une autre erreur noobtastic- J'ai eu une autre jquery qui était en conflit. Quand j'ai enlevé ça, ça a marché comme tu l'as dit. Merci de vérifier que cela fonctionne. –

Quelle version de jQuery utilisez-vous? Ces méthodes ne semblent pas avoir les bons paramètres pour jQuery 1.3+. Je pense que ce serait plus comme:

$('a#nav-toggle').click(function() { 
    $('#navCol').slideToggle(400); 
    $('#main').toggleClass('mainLarge'); 
    $('body').toggleClass('backgroundOffset'); 
    return false; 
});

Vous ne pouvez pas fournir une vitesse pour la bascule de classe - il soit a la classe ou non. Le second argument standard est un drapeau indiquant si la nouvelle valeur doit être activée ou désactivée.

Source

2010-01-29 22:18:59 tvanfosson

Intéressant, car la vitesse semble affecter le basculement dans Firefox. Mais merci pour le conseil! Donc, pour faire glisser les éléments, je devrais l'épeler dans jQuery, et ne pas essayer de le faire avec des classes? –

Par diapositive, je veux dire animer, pas juste casser. –

Oui, si vous voulez qu'ils glissent vers une position particulière, vous devez utiliser la fonction animée et spécifier où vous voulez qu'ils finissent. – tvanfosson

jQuery: Toggling plusieurs choses avec un clic (noob)

Répondre

Questions connexes