jquery onclick ajouter à la marge de gauche

Je suis en train d'essayer quelque chose d'assez simple en JS, mais je ne peux pas le faire fonctionner...

Je voudrais que lorsque l'on clique sur un div pour ajouter une marge négative de gauche à une autre div, mais je veux que ce qui s'est passé à chaque fois que je clique sur le div, pas une seule fois comme il le fait maintenant.
Eveytime je clique sur mon #next_nav, je voudrais que le #nav pour passer de 10px négatif.
ici, il ne fonctionne qu'une seule fois.
voici mon js :

$(function() {
  $('#next_nav').click(function () {
     $( "#nav" ).css('margin-left','-10px');
  });
});

et mon code HTML :

<div id="next_nav"></div>
<div id="nav"></div>

voici mon JSfiddle : http://jsfiddle.net/Beyzd/

quelqu'un peut-il m'aide avec cela ?
merci beaucoup,

InformationsquelleAutor mmdwc | 2014-03-03
  1. 12

    ajouter un = en face de votre valeur: 

    $(function() {
    $('#next_nav').click(function() {
       $('#nav').css('margin-left', '-=10px');
    });
});

    Travail De Violon

    MODIFIER

    Si vous souhaitez l'animer, l'utilisation animate() méthode. Voici une violon pour vous.

    • est-il possible d'ajouter une animation à le faire bouger ? comme .animer lent ?
    • merci @AloneInTheDark, mais dans votre violon la marge n'est pas 10px, et en cliquant à nouveau sur le #next_nav, mon nav prend sa position initiale, savez-vous pourquoi ?
    • Parce qu'il y est une "bascule" de la valeur de la fonction. La bascule de moyens, une propriété peut être on/off avec un événement d'action. Vous pouvez modifier cette valeur (je ne me souviens pas comment faire pour désactiver le moment). Je suppose qu'il n'y a pas de paramètre comme la "marge" dans animate() de la fonction. Vous pouvez lire quelques documents à ce sujet.
    InformationsquelleAutor AloneInTheDark
  2. 1

    Vous pouvez essayer ce

    var pixels=0;
$(function() {
    $('#next_nav').click(function () {
       pixels=pixels-10;      
       $( "#nav" ).css('margin-left',pixels);
    });
});

    Travail violon est disponible ici.

    InformationsquelleAutor Naveed Yousaf
  3. 1

    Vérifier sur jsFiddle

       $(document).ready(function (){
       $("#next_nav").on("click", function() {
          var $left = $("#nav").css('margin-left');
          var $newval = (parseInt($left) - 10) + "px";
          $("#nav").css ({
            'margin-left' : $newval
          });
       });
   });
    InformationsquelleAutor Jay Patel
  4. 0

    Fixe pour vous:
    Version mise à jour

    modifier le .css('margin-left','-10px'); à .css({'margin-left' : '-10px'});

    InformationsquelleAutor Paradoxis
  5. 0

    Essayez ceci:

    $(function() {
$('#next_nav').click(function () {
  marginleft=parseInt($( "#nav" ).css('margin-left').replace('px',''));
  $( "#nav" ).css('margin-left',marginleft-10+'px');
});
});

    Travail De Violon

    InformationsquelleAutor Milind Anantwar
  6. 0

    il suffit de changer cette $( "#nav" ).css('margin-left','-=10px');

    InformationsquelleAutor Krishna M
  7. 0
    $(function() {
  var count=0;
  $('#next_nav').click(function () {
  count-=10;

$( "#nav" ).css('margin-left',count);
});
});

    Et inclure jQuery

    InformationsquelleAutor Pratik