타이머를 사용하여 div를 뒤집기

Question

저는 타이머를 사용하여 5 초마다 뒤집기를 원하는 사각형 DIV (300px x 300px)를 가지고 있습니다. 이 작업을 수행하려면 jQuery flip plugin을 사용하고 싶습니다. 여기에 지금까지이 작업은 다음과 같습니다

http://jsfiddle.net/psivadasan/4dPaX/3/

어떤 도움을 주셔서 감사합니다.

Answer 1

jsfiddle에 라이브러리가 포함되어 있지 않으므로 작동하지 않습니다. 하지만 기본적인 아이디어는 간격 내에서 플립 코드를 삽입하는 것입니다

var $flipBox = $('#flipbox'), 
    flip_opts = [{ 
     direction: 'tb', 
     bgColor: '#FFFFF', 
     color: '#000000', 
     speed: 500, 
     content: "Hello World!" 
    }, 
    { 
     direction: 'tb', 
     bgColor: '#FFFFF', 
     color: '#000000', 
     speed: 500, 
     content: "Goodbye World!" 
    }], 
    curr_indx = 0, 
    timer  = setInterval(function() { 
     if (curr_indx >= flip_opts.length) { 
      curr_indx = 0; 
     } 
     $flipBox.flip(flip_opts[curr_indx]); 
     curr_indx++; 
    }, 5000); 

flip_opts 변수가 객체의 배열, 각 개체는 플립 플러그인에 전달되는 옵션의 집합입니다. 이 코드는 각 옵션 집합을 순서대로 처리 한 다음 처음으로 되돌아갑니다.

당신이 호출 할 수있는 간격을 중지하려면 : clearInterval(timer);

Answer 2

아무렇지도 않게 JavaScript를 주기적으로 실행하려면 setInterval을 사용할 수 있습니다. 플립 코드의 경우 :

setInterval(
    function() { 
     $('#flipbox').flip({ 
        direction: 'tb', 
        bgColor: '#FFFFF', 
        color: '#000000', 
        speed: 500, 
        content: "Hello World!" 
       }); 
    }, 
    5000);