| Days | |
| Hours | |
| Minutes | |
| Seconds |
I was playing with mootools today, and whilst trying to create a swapping pair of content divs, I put together a neat algorithm for handling the callbacks and getting it to do what I want.
I only wanted one div showing at a time, and I wanted them to swap with a function. So I set up the following guardian variable and functions. Check it out.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | var loadingDiv; var contentDiv; var transitionState = 0; window.onload = function () { loadingDiv = new Fx.Slide('loadingDiv', {onComplete: nextTransition}); loadingDiv.hide(); contentDiv = new Fx.Slide('contentDiv', {onComplete: nextTransition}); } function swapThem() { if(transitionState == 0) { transitionState = 1; contentDiv.slideOut(); } else { transitionState = 2; loadingDiv.slideOut(); } } function nextTransition() { if(transitionState == 1) { transitionState = 3; loadingDiv.slideIn(); } else if (transitionState == 2) { transitionState = 4; contentDiv.slideIn(); } else if (transitionState == 4) { transitionState = 0; } } |
It might be a little verbose, but it works like a charm.
Posted March 18th, 2007 - Permalink