魔兽背景，大爱~
废话不多说，上代码，觉得好用喜欢的请关注收藏！
代码亲测：IE7、8、9、11，谷歌、FF均可用。
先来一张效果图~~~
<style type="text/css">/*自动轮播*/.a_slide{position: relative;height: 100%;width: 440px;overflow: hidden;float: left;margin: 20px 16px 0 -20px;}.a_slide li{list-style: none;}.a_slide .slides li{position: relative;display: none;-webkit-animation-name: fadeIn;/*动画名称*/-webkit-animation-duration: 1s;/*动画持续时间*/-webkit-animation-iteration-count: 1;/*动画次数*/-webkit-animation-delay: 0s;/*延迟时间*/}.a_slide .slides li.active{display: block;}.a_slide .slides li img{width: 400px;height: 250px;}.a_slide .slides .caption{position: absolute;bottom: 5px;width: 100%;left: 0;height: 40px;line-height: 40px;color: #fff;background: rgba(0, 0, 0, .5);filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#80000000, endColorstr=#80000000);}.a_slide .slides .caption p{margin-left: 1em;margin-right: 100px;font-size: 16px;font-weight: bold;text-align: left;overflow: hidden;word-wrap: normal;white-space: nowrap;text-overflow: ellipsis;cursor: pointer;margin-top: 0;}.a_slide .navigations{position: absolute;right: 10px;bottom: 15px;overflow: hidden;}.a_slide .navigations li{float: left;margin-left: 10px;height: 10px;width: 10px;border-radius: 10px;background: #c3bebf;cursor: pointer;}.a_slide .navigations li.active{background: #FFDE00;}</style><div class="a_slide j-tab"><ul class="slides"><li class="j-tabpane active"><a href="" target="_blank"> <img src="/dbcc8e45854c158f//0915/ori_54167948a7daf.jpeg"><div class="caption"><p>魔兽001</p></div></a></li><li class="j-tabpane"><a href="" target="_blank"> <img src="/52miji/allimg/071025/1924554.jpg"><div class="caption"><p>魔兽002</p></div></a></li><li class="j-tabpane"><a href="" target="_blank"> <img src="http://img1./sJFkQnlJAmgkznfYSaz4ug==/2099240376408189472.jpg"><div class="caption"><p>魔兽003</p></div></a></li><li class="j-tabpane"><a href="" target="_blank"> <img src="/UploadFiles_2396/12/1209144257556.jpg"><div class="caption"><p>魔兽004</p></div></a></li></ul><ul class="navigations"><li class="j-tabctrl active"></li><li class="j-tabctrl"></li><li class="j-tabctrl"></li><li class="j-tabctrl"></li></ul></div><script src="/jquery-latest.js" type="text/javascript"></script><script type="text/javascript">var jq = jQuery.noConflict();! function(a) {var b = {eventType: "click",tabctrlClass: "j-tabctrl",tabpaneClass: "j-tabpane",activeClass: "z-active",initialTab: 0,autoplay: !1,interval: 3e3,callback: a.noop},c = function(c, d) {return this.el = c, this.jqel = a(c), this.timer = null, this.options = a.extend({}, b, d), this.current = this.options.initialTab, this.tabctrlClass = "." + this.options.tabctrlClass, this.tabpaneClass = "." + this.options.tabpaneClass, this.jqtabctrls = this.jqel.find(this.tabctrlClass), this.jqtabpanes = this.jqel.find(this.tabpaneClass), this.length = this.jqtabctrls.length, this.init()};c.prototype = {constructor: c,init: function() {var b = this,c = this.options.activeClass,d = "hover" === this.options.eventType ? "mouseenter" : this.options.eventType;this.jqtabctrls.removeClass(c).eq(this.current).addClass(c), this.jqtabpanes.removeClass(c).eq(this.current).addClass(c), this.jqel.on(d, this.tabctrlClass, function() {b.current = b.jqtabctrls.index(a(this)), b.move(b.current), b.timer && clearTimeout(b.timer)}), this.jqel.on("mouseenter", this.tabpaneClass, function() {clearTimeout(b.timer)}), this.jqel.on("mouseleave", this.tabpaneClass, function() {b.autoplay()}), b.autoplay()},move: function(a) {var b = this.options.activeClass;this.jqtabctrls.removeClass(b).eq(a).addClass(b), this.jqtabpanes.removeClass(b).eq(a).addClass(b), this.options.callback(a)},autoplay: function() {if (this.options.autoplay) {var a = this;! function b() {a.timer = setTimeout(function() {a.current < a.length - 1 ? a.current++ : a.current = 0, a.move(a.current), b()}, a.options.interval)}()}}}, a.fn.tab = function(a) {return this.each(function() {new c(this, a)})}}(jQuery);! function($) {/*自动轮播效果*/$(function() {$('.a_slide').tab({activeClass: 'active',eventType: 'hover',autoplay: true,interval: 2000});});}(jQuery);</script>
好用请关注收藏噢~，欢迎大神指导。
JQuery自动轮播效果 带字幕说明 带底部滚动圈圈 兼容IE7以上所有主流浏览器。（魔兽背景哟亲）
