Posted By

ryarwood on 03/08/11


Tagged

javascript jquery animation cycle


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

acousins


jQuery Cycle Front Page Animation - Fade Version


 / Published in: jQuery
 

The fade version of the Colony Park Website

  1. var onAfterStateOne = 'first';
  2. var onAfterStateTwo = 'first';
  3. var onAfterStateThree = 'first';
  4.  
  5. $('#frontImg3').cycle({
  6. fx: 'fade',
  7. speed: 1200,
  8. timeout: 0
  9. });
  10.  
  11. $('#frontImg2').cycle({
  12. fx: 'fade',
  13. speed: 1200,
  14. timeout: 0,
  15. after: onAfterTwo
  16. });
  17.  
  18. $('#frontImg1').cycle({
  19. fx: 'fade',
  20. speed: 1200,
  21. timeout: 5000,
  22. after: onAfterOne
  23. });
  24.  
  25. function onAfterOne() {
  26. if (onAfterStateOne == 'first') {
  27. onAfterStateOne = 'nope';
  28. } else {
  29. $('#frontImg2').cycle('next');
  30. }
  31. }
  32.  
  33. function onAfterTwo() {
  34. if (onAfterStateTwo == 'first') {
  35. onAfterStateTwo = 'nope';
  36. } else {
  37. $('#frontImg3').cycle('next');
  38. }
  39. }

Report this snippet  

You need to login to post a comment.