Cross-Browser Visibility Transitions
transition 23: random

Transition 23 is not a transition, per se, but a call to our script to select any of the other transitions and execute it. We, therefore, immediately pass control to function twentythree() which will select a random transition.

The single argument passed to twentythree() is dur, which was originally passed to doTransNS(). It must be explicitely passed, since it originates as an argument and not as a declared variable. We do not want to use the setInterval() method, as no transition is called for yet, so we return from doTransNS().

case 23:
    twentythree(dur);
    return;

twentythree()

In our Jigsaw Puzzle columns, we used getRandNums(), a function that returns a random number between two numbers passed as arguments. Function twentythree(), therefore, calls getRandNums() requesting a random number between 0 and 22. The result is assigned to newTrans. We then call doTransNS(), again, this time with an executable transition.

function twentythree(dur){
    newTrans = getRandNums(0,22);
    doTransNS(whichEl,newTrans,dur);
}

function getRandNums(from,to){
  temp = parseInt((Math.random() * (to-from)) + (from));
  while (isNaN(temp)) {
    temp = parseInt((Math.random() * (to - from)) + (from));
  }

  for (i=0; i<arHidden.length; i++) {
    if (temp == arHidden[i]) {
      temp = parseInt((Math.random() * (to - from)) + (from));
      while (isNaN(temp)) {
        temp = parseInt((Math.random() * (to - from)) + (from));
      }
      i=0;
    }
  }

  return temp
}

Note: Several of our transitions are used to show hidden elements. We assigned them to the arHidden array. Our random number generator will compare any number generated to the elements of arHidden. If a match is found, it regenerates a random number. It will only return a number that corresponds to a visible-to-hidden transition. Hidden-to-visible transitions are excluded from the random selection.

That's it. Let's wrap up.