Tắt quá trình chuyển đổi CSS3 của Bootstrap trên thanh tiến trình

Question

Bất cứ ai cũng biết cách tắt tính năng chuyển đổi CSS3 của Bootstrap trên thanh tiến trình? Tôi đang cập nhật chúng thông qua javascript/jquery và không muốn chúng làm hoạt hình.

này trông đầy hứa hẹn nhưng không thể làm cho nó làm việc: Turn Off CSS3 Animation With jQuery?

Info trên thanh tiến trình: http://twitter.github.com/bootstrap/components.html#progress

Answer 1

Bạn có thể tắt các hiệu ứng chuyển tiếp bằng cách thiết lập các quy tắc css transition-none, như vậy:

.progress .bar { 
    -webkit-transition: none; 
    -moz-transition: none; 
    -ms-transition: none; 
    -o-transition: none; 
    transition: none; 
}​ 

Answer 2

Kể từ khi hoạt hình là xuất phát từ lớp active bạn chỉ có thể sử dụng

$('.progress').removeClass('active'); 

hoặc

$('.progress').toggleClass('active'); 

Answer 3

tôi giải quyết vấn đề với javascript

 $('#proc').hide(); 
     $("#proc").width(0 + "%"); 
     $('#proc').show(); 

Đối với tôi làm việc tốt của nó. Không nhấp nháy và chỉ làm công việc của mình. Bạn cũng có thể làm điều đó với css tinh khiết tôi nghĩ.

Answer 4

Bạn cũng có thể làm điều đó dừng lại với $(".progress-bar").stop() hoạt ảnh và sau đó khởi động lại.

Tôi muốn thanh trở lại 0 và bắt đầu lại để di chuyển đến 100%. Vì vậy, ở đây làm thế nào nó đi:

$(".progress-bar").stop();  //Stopping the current animation at the current width 
$(".progress-bar").animate({width: "0%"}, 100);  //Going back to 0% smoothly in 100ms 
$(".progress-bar").animate({width: "100%"}, 1000); //Restarting the process bar to 100% 

Tôi hy vọng nó sẽ giúp một số.