按時間觸發事件

Question

我想觸發一個元素來完成一個css轉換;但是，我不想使用任何物理觸發器，例如懸停或單擊。我想在特定的時間開始過渡，然後在特定的時間間隔重複。這可以完成使用jQuery。

Answer 1

您可以使用setInterval並在特定的時間範圍後添加過渡類，並在特定的時間範圍後將其刪除。

看到這一點： - 寫設定的時間間隔http://jsbin.com/jemotexono/1/edit?html,css,js,output

最簡單的方法是： -

setInterval(function(){ 
    //Your code goes here 

    },2000); //specify the time in milliseconds 

Answer 2

Try out the sample code 

**HTML** 
<div></div> 

**CSS** 
div { 
    width: 100px; 
    height: 100px; 
    background: green; 
    -webkit-transition: width 1s; /* For Safari 3.1 to 6.0 */ 
    transition: width 1s; 
} 

**Java Script** 
$(document).ready(function(){ 
    var width = 100; 
    //set the specific time to trigger 
    setTimeout(function(){ trigger(); }, 1000); 
    //function which perform the tranisition repeatedly 
        function trigger(){  
    setInterval(function(){ 
     width = width +5; 
     $("div").css("width",width); 
          }, 1000); 

}        
});