jQuery 회전기의 시작 지연, 서로 1 초 간격

Question

첫 페이지에 3 개의 회전기가 있고 서로 1 초 후에 시작하기를 원합니다.

$(document).ready(function(){
    $('#rot_top').cycle({       
        speed: 500,
        timeout: 2000
    });
    $('#rot_mid').cycle({       
        speed: 500,
        timeout: 2000
    });
    $('#rot_btm').cycle({       
        speed: 500,
        timeout: 2000
    });
});

초기 시작 후 - 일반 시간 초과에 따라 진행해야합니다.

미리 도움을 주셔서 감사합니다.

Answer 1

당신이 사용하는 것 같습니다 jQuery 사이클 플러그인? 그렇다면 a delay 첫 번째 변경 만 지연시키는 옵션 :

$(document).ready(function(){
    $('#rot_top').cycle({           
        speed: 500,
        timeout: 2000
    });
    $('#rot_mid').cycle({           
        speed: 500,
        timeout: 2000,
        delay: 1000,
    });
    $('#rot_btm').cycle({           
        speed: 500,
        timeout: 2000
        delay: 2000,
    });
});

이것은 첫 번째 사이클을 즉시 시작하고, 두 번째주기는 두 번째주기에, 그리고 그 다음에 세 번째 사이클은 두 번째주기입니다.

Answer 2

setTimeout 이것에 매우 유용합니다. 이것을 시도해보십시오.

$(document).ready(function(){ 

  startCycle = function({
    $('#rot_top').cycle({speed: 500, timeout: 2000 }); 
    $('#rot_mid').cycle({speed: 500, timeout: 2000 }); 
    $('#rot_btm').cycle({speed: 500, timeout: 2000 }); 
  })

  setTimeout(startCycle();, 1000)
});