La variable Javascript ne fonctionne pas. Pourquoi?

Question

Je ne comprends pas quelque chose sur les variables en javascript. J'essaie de changer/calculer "offset" (avec la variable "theOffset") soit avant que la fonction localScroll se produise, ou plus préférablement lorsque vous redimensionnez la fenêtre. Aucune des instances ci-dessous ne fonctionne, acceptez pour "// initialiser le décalage". Comment modifier la variable "theOffset" à l'intérieur de "$ .localScroll"?

jQuery(function($){ 

    //initialize offset 
    var windowWidth = $(window).width(); 
    if (windowWidth < 900) { 
     theOffset = 0; 
    } else { 
     theOffset = ($(window).width() - 900)/-2; 
    } 

$(window).resize(function() { 
    //calculate offset 
    var windowWidth = $(window).width(); 
    if (windowWidth < 900) { 
     theOffset = 0; 
    } else { 
     theOffset = ($(window).width() - 900)/-2; 
    } 
}); 


    $.localScroll({ 
     target: '#content', 
     queue:true, 
     duration:1500, 
     hash:true, 
     stop:true, 
     onBefore:function(e, anchor, $target){ 
      //calculate offset 
      var windowWidth = $(window).width(); 
      if (windowWidth < 900) { 
       theOffset = 0; 
      } else { 
       theOffset = ($(window).width() - 900)/-2; 
      } 
     }, 
     offset: {top:0, left: theOffset, 
     onAfter:function(anchor, settings){ 
      if (windowWidth < 900) { 
       theOffset = 0; 
      } else { 
       theOffset = ($(window).width() - 900)/-2; 
      } 
     } 
    }); 
}); 

Si besoin de savoir, je suis le centrage d'un conteneur div à la fenêtre avec le décalage dans un site Web de défilement côté de fantaisie;)

Answer 1

Vous pouvez déclarer un objet myOffset qui sera transmis par référence à offset: Vous pouvez également affiner la presque fonction quadruplicated en une seule fonction nommée:

var myOffset = {top: 0, left: theOffset}; 
function calcOffset() { 
    var windowWidth = $(window).width(); 
    if (windowWidth < 900) { 
    myOffset.left = 0; 
    } else { 
    myOffset.left = (windowWidth - 900)/-2; 
    } 
} 
calcOffset(); 
// note leaving off the() will pass the function as a parameter instead of calling it 
$(window).resize(calcOffset); 

$.localScroll({ 
    target: '#content', 
    queue: true, 
    duration: 1500, 
    hash: true, 
    stop: true, 
    onBefore: calcOffset, 
    offset: myOffset, 
    onAfter: calcOffset 
}); 

Answer 2

déclare theOffset en dehors de la fonction jquery

 

var theOffset = 0; 

jquery(function ($) { 
}) 
 

Answer 3

I pensez que votre problème est ici:

offset: {top:0, left: theOffset, 

Tout d'abord, il vous manque un suivi}.

Deuxièmement, vous faites ce que l'on appelle "passer par la valeur" - la valeur qui est envoyée lorsque vous appelez $ .localscroll() est en fait une copie de la valeur spécifiée dans l'option Offset.

Quelle version de localScroll utilisez-vous? J'ai téléchargé la dernière source que j'ai pu trouver, qui était en 1.2.7, et je ne vois rien sur offset n'importe où.

Il n'y a pas de solution immédiate pour résoudre votre problème sans voir la source localScroll. Parfois, les auteurs de plugins jQuery comme celui-ci fournissent un moyen de mettre à jour les options. Si ce n'est pas le cas, vous devrez peut-être modifier la source de localScroll pour saisir la valeur de décalage par un rappel de la fonction plutôt que par une propriété d'objet:

offset: {top:0, left: function() { return theOffset; } } 

Notez que le ne fonctionnera pas ci-dessus sans modifier la source localScroll pour obtenir ces données via un appel de fonction au lieu de la propriété options.

Answer 4

Notez que dans l'exemple ci-dessus, si vous appelez setupSomeGlobals() à nouveau, une nouvelle fermeture (stack-frame!) est créée. Les anciennes variables gLogNumber, gIncreaseNumber, gSetNumber sont remplacées par de nouvelles fonctions ayant la nouvelle fermeture. (En JavaScript, chaque fois que vous déclarez une fonction dans une autre fonction, la ou les fonctions internes sont/sont recréées chaque fois que la fonction externe est appelée.)