Autoslide

Autoslide

I'm having trouble figuring how to make this slide through automatically. I've been trying to figure out how to include setTimeout and or setInterval but nothing is making sense to me.

  2. $(document).ready(function() {


  5. $(".folio_block").each(function() {
  7. //Set Default State of each portfolio piece
  8. $(this).find(".paging").show();
  9. $(this).find(".paging a:last").addClass("active");
  11. //Inject <span> for Tool tip
  12. $(this).find(".image_reel a").append("<span></span>");
  13. $(this).find(".image_reel span").css({"opacity" : "0"});
  15. //Get size of images, how many there are, then determin the size of the image reel.
  16. var windowWidth = $(this).find(".image_reel span").width();
  17. var imageSum = $(this).find(".image_reel img").size();
  18. var imageReelWidth = windowWidth * imageSum;
  20. //Adjust the image reel to its new size
  21. $(this).find(".image_reel").css({'width' : imageReelWidth});
  23. });

  25. //Hover Effect for Tooltip
  26. $(".image_reel a").hover(function() {
  27. $(this).find("span").stop().animate({ opacity: 0.2}, 200 ).show();
  28. }, function() {
  29. $(this).find("span").stop().animate({ opacity: 0}, 200 );
  30. });

  32. //Pagin events
  33. $(".paging a").click(function() {
  35. var triggerID = $(this).attr("rel") - 1;
  36. alert (triggerID);
  37. var imgWidth = $(this).parent().parent().find("img").width();
  38. var image_reelPosition = triggerID * imgWidth;
  40. //Ignore if Active
  41. if ( $(this).hasClass("active")) { 
  42. //Do Nothing
  43. }
  44. else {
  45. //Set active paging
  46. $(this).parent().parent().find(".paging a").removeClass("active");
  47. $(this).addClass("active");

  49. //image_reel Image
  50. $(this).parent().parent().find(".image_reel").animate({ 
  51. left: -image_reelPosition
  52. }, 300 );
  53. }
  54. return false;
  56. });
  57. });

    • Topic Participants

    • dru6