jQuery图片文字动画切换特效 文字和图片单独修改

这款jQuery图片文字动画切换特效，非常炫酷，用来做网站的横幅banner轮播效果绝佳，中下方还有索引按钮控制切换。

js代码

<script src="js/jquery.Yl.Slide.min.js"></script>

<script>

$(function(){

$('.Yl-container').YlSlide({

wrapper:'.Yl-wrapper',

slideClass:'.Yl-slide',

stylePrefix:'.Yl-',

slideLength:3,

pages:true,

pagination:'.Yl-pagination',

pagingSelect:'.Yl-pagination-bullet-active',

autoplay:25000,

imgTemplate:{

0:['<div class="Yl-img0"></div>'],

1:['<div class="Yl-img1"></div>'],

2:['<div class="Yl-img2"></div>']

},

fontTemplate:{

0:['<div class="Yl-font0">一人之下</div>','<div class="Yl-font1">术之尽头，炁体源流</div>','<div class="Yl-font2">国漫崛起</div>'],

1:['<div class="Yl-font0">画江湖</div>','<div class="Yl-font1">不良人、侠岚、换世门生、灵主</div>','<div class="Yl-font2">国漫崛起</div>'],

2:['<div class="Yl-font0">镇魂街</div>','<div class="Yl-font1">末将于禁 愿为曹家世代赴汤蹈火</div>','<div class="Yl-font2">国漫崛起</div>']

},

fontAnimationMode:{

0:['fadeInUp','fadeInUp','slideInLeft'],

1:['fadeInUp','fadeInUp','slideInLeft'],

2:['fadeInUp','fadeInUp','slideInLeft']

},

customTemplate:{

0:['<div class="Yl-Button"><a href="javascript：void(0);">查看详情</a></div>'],

1:['<div class="Yl-Button"><a href="javascript：void(0);">查看详情</a></div>'],

2:['<div class="Yl-Button"><a href="javascript：void(0);">查看详情</a></div>']

},

callback:function(e){

//整个dom加载完成后的回调函数、切换动画前的回调

},

before: function(e) {

//页面切换前的回调函数

}, 

after: function(e) {

//页面切换完成后的回调函数

 

}

});

});

</script>