如何设置javascript中创建的过渡动画?

时间:2013-12-28 11:53:47

标签: javascript html

我创建了一个java脚本,用于在一段时间间隔后连续更改div的背景。这是脚本:

jQuery( function( $ ) {
var images = [ "images/bg-a.jpg","images/bg-b.jpg" , "images/bg-c.jpg" ];
var bg_spans = [ "#bg-a","#bg-b","#bg-c" ];
var currentImage = 0;

function changeBackground() {

    $( '#bdy' ).css( { backgroundImage: 'url(' + images[ ++currentImage ] + ')'} );
    for(i=0; i<bg_spans.length; i++ ) {
      if(i==currentImage) {
         $( bg_spans[currentImage]).css ( { background: "#eb5405"} );
         $( bg_spans[currentImage]).css ("border-color","#fff" );
      }
      else {
         $( bg_spans[i]).css ( { background: "#000098"} );
         $( bg_spans[i]).css ("border-color","#000098" );  

      }
    }

    if ( currentImage >= images.length - 1 ) {
        currentImage -= images.length;
    }
}
setInterval( changeBackground, 6000 );  
});

我想要一些动画,就像图像应该顺利淡入淡出。并且在一些时间间隔之后改变图像的过渡应该像某种类型的动画一样平滑地完成。怎么做?

1 个答案:

答案 0 :(得分:1)

这是链接,您可以更改过渡样式 Owl slider