2012-10-27 5 views
0

의 모든 X의 양이 부트 스트랩 진행률 표시 줄이 100 %로 갈 수 있도록 할 수 있을까 5 초마다트위터 부트 스트랩 진행률 표시 줄이 100 % 초

<div class="progress progress-striped active"> 
     <div class="bar" style="width: 40%;"></div> 
     </div> 

진행 표시 줄이 폭 스타일을 통해 채워진다는 말 위의 40 %를 완료했을 때

5 초 안에 100 %까지로드를 부드럽게 만들고 다시 0으로 재설정하고 다시 시작하려면 어떻게해야합니까?

감사합니다.

+1

은 어쩌면 이것은 당신이 찾고있는 무언가? http://jsfiddle.net/xXM2z/ – user194076

+0

또는 http://jsfiddle.net/xXM2z/489/? – Blender

+0

답장을 보내 주셔서 감사합니다. 정확히 내가 필요로하는 것은 매회 반복해야합니다. 100 %에 도달했습니다! – Koala

답변

1

이 답변에서 나는 @ Blender의 접근 방식을 약간 변형하여 영원히 실행했습니다.

이 경우 나는 인수 인 animate 함수를 사용하고 있습니다.
http://jsfiddle.net/xXM2z/490/
전체 JS 코드 :

$(document).ready(function(){ 
    animateScroll(); 
}); 

function animateScroll() 
    { 
    $('.bar').animate({ 
    width: '100%' 
}, { 
    duration: 5000, 
    easing: 'linear', 
    complete:function(){ $(this).css("width","0%"); 
    } 
}); 
animateScroll(); 
}