Comment basculer entre deux tableaux

Question

Je suis en train de créer un vélo animation de glissement pour ensemble d'éléments, j'ai deux tableaux:

var elms = [elm1, elm2, elm3]; 
var props = [{x,y,width,height,z-index,opacite,....}, {....}, {....}]; 

sur l'initialisation, elms se positionnera dans le même ordre que props: « -> ne fait pas partie de la syntaxe, il est juste de rendre les choses plus faciles à expliquer et cela signifie« faire quelque chose avec »

elms[0] -> props[0]; 
emls[1] -> props[1]; 
elms[2] -> props[2]; 

mais je veux le cycle comme eux:

elms[0] -> props[2] 
elms[1] -> props[0] 
elms[2] -> props[1] 

puis:

elms[0] -> props[1] 
elms[1] -> props[2] 
elms[2] -> props[0] 

et ainsi de suite ...

j'ai essayé ceci:

function index(n, array){ 
    var m = n; 
    if(n > array.length){ 
     m = n - array.lenth; 
    }else if(n < 0){ 
     m = array.length + n; 
    } 
    return m; 
} 

var active = 0; //the front element 

function slide(direction){ 
    for (i=0; i< elms.length; i++) 
    { 
     elms[i] -> props[index(i - active, props)] 
    } 
    if(direction == 'fw'){ 
     if(active++ => elms.length){ 
      active = 0; 
     }else{ 
      active++; 
     } 
    }else if(direction == 'bw'){ 
     if(active-- < 0){ 
      active += elms.length; 
     }else{ 
      active--; 
     } 
    } 
} 

setInterval(function(){slide('fw')}, 3000); 

maintenant le code ci-dessus fonctionne bien, mais je suis sûr que cela a été fait beaucoup fois avant et je me demande si quelqu'un sait s'il existe une meilleure façon moins compliquée de faire cela qui permet de faire une boucle en avant et en arrière?

Answer 1

Que diriez-vous d'utiliser le module? Avoir une var globale que vous incrémentez chaque fois que vous changez, puis modulez cela avec la longueur des tableaux. Vous pouvez accéder aux tableaux comme: props[shift%len]

Si len est 3 (comme ci-dessus), vous pourriez obtenir ces résultats si vous accédez aux accessoires par rapport à la première elmsIdx (0):

POC: jsFiddle. net/Q8dBb, aussi cela fonctionnerait sans modifier vos tableaux donc je crois que ce serait plus rapide

shift = 0; // (shift + elmsIdx)% len == 0;
décalage = 1; // (shift + elmsIdx)% len == 1;
shift = 2; // (shift + elmsIdx)% len == 2;
shift = 3; // (shift + elmsIdx)% len == 0;
décalage = 4; // (shift + elmsIdx)% len == 1;
etc

En fait, en utilisant un objet pourrait le rendre plus flexible (décaler de plusieurs façons, remise à zéro, tout ce que vous voulez ajouter).Voici un exemple pour que:

function Shift(len) { 
    var _len = len; 
    var _s = 0; 
    this.left = function() { 
     _s = (_s + 1)% _len; 
    } 
    this.right = function() { 
     _s = (_s - 1); 
     if (_s < 0) { 
      _s = _s + _len; 
     } 
    } 
    this.get = function(idx) { 
     return (_s + idx)% _len; 
    } 
    this.reset = function() { 
     _s = 0; 
    } 
} 

utilisé: http://jsfiddle.net/6tSup/1/

Answer 2

Si cela ne vous dérange pas de modifier le tableau des accessoires, vous pouvez juste .shift() hors du premier élément, puis .push() est sur la fin du tableau, puis à nouveau faire:

elms[0] -> props[0]; 
emls[1] -> props[1]; 
elms[2] -> props[2]; 

Pour faire pivoter les accessoires tableau, vous pouvez simplement faire ceci:

function rotateProps() { 
    var front = props.shift(); 
    props.push(front); 
} 

Ainsi, chaque cycle il suffit d'appeler rotateProps() puis répéter ce que vous avez fait la première fois.