按时间触发事件

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); 

}        
});