采用jquery+css3实现响应式宽屏图文轮播特效

安装方法：

载入CSS样式（包含一个字体样式）

<link href="style/style.css" rel="stylesheet" type="text/css" />
<link href='http://fonts.useso.com/css?family=PT+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css' />

在如Jquery库文件和插件JS文件，并初始化配置插件

<script type="text/javascript" src="http://ajax.useso.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="js/jquery-runbanner.js"></script> 
<script type="text/javascript">
$(function(){
    $('#obo_slider').runbanner({
		className: 'oneByOne1', 	             
		easeType: 'random',  //动画参数
		/*
		"rollIn", "fadeIn", "fadeInUp", "fadeInDown", "fadeInLeft", "fadeInRight", "fadeInRight", "bounceIn", "bounceInDown", "bounceInUp", "bounceInLeft",        "bounceInRight", "rotateIn", "rotateInDownLeft", "rotateInDownRight", "rotateInUpLeft", "rotateInUpRight" (18种动画类型可调用)
		*/
		slideShow: true  //为false时不会自动播放
	});  
})
</script>

一共有18中动画效果，如下：

1、rollIn2、fadeIn3、fadeInUp4、fadeInDown

5、fadeInLeft

6、fadeInRight

7、fadeInRight

8、bounceIn

9、bounceInDown

10、bounceInUp

11、bounceInLeft

12、 bounceInRight

13、rotateIn

14、rotateInDownLeft

15、rotateInDownRight

16、rotateInUpLeft

17、rotateInUpRight

18、random

看着舒服，运行流畅，很不错的一个JQuery插件