$.fn.imgtransition = function(o){
var defaults = {
speed : 3000,
animate : 1000
};
o = $.extend(defaults, o);
return this.each(function(){
var arr_e = $("li", this);
function shownext(){
var hover = arr_e.filter(".hover").length ? arr_e.filter(".hover") : arr_e.first();
var next = hover.next().length ? hover.next() : arr_e.first();
next.css({opacity: 0.0, "z-index": 3}).addClass('hover').animate({opacity: 1.0}, o.animate, function(){
hover.removeClass('hover').css({"z-index": 2});
});
}
setInterval(function(){
shownext();
},o.speed);
});
};
$(document).ready(function(){
$("#videopos").imgtransition({
speed:3000, //图片切换时间
animate:1000 //图片切换过渡时间
});
});
<!--视频框轮显-->
<div class="video pos">
<ul id="videopos">
<li><span class="hover"><img src="images/1.jpg" ></span></li>
<li><span ><img src="images/1.jpg"></span></li>
<li><span><img src="images/222.jpg"></span></li>
<li><span><img src="images/1.jpg"></span></li>
<li><span><img src="images/222.jpg"></span></li>
<li><span><img src="images/1.jpg"></span></li>
</ul>
</div>