无缝图片轮播效果

使用方法：

引入CSS样式、jQuery库文件、插件JS文件和插件初始化配置

<link rel="stylesheet" href="css/orbit-1.2.3.css">
<link rel="stylesheet" href="css/sucainiu.css">
<script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.orbit-1.2.3.min.js"></script>
<!--[if IE]>
<style type="text/css">
.timer { display: none !important; }
div.caption { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);zoom: 1; }
</style>
<![endif]-->
<!-- Run the plugin -->
<script type="text/javascript">
    $(window).load(function() {
        $('#featured').orbit();
    });
</script>

HTML结构

<div id="featured">
    <div class="content" style="">
      <h1>Orbit does content now.</h1>
      <h3>Highlight me...I'm text.</h3>
    </div>
    <a href=""><img src="images/overflow.jpg" /></a> 
    <img src="images/captions.jpg" data-caption="#htmlCaption" /> 
    <img src="images/features.jpg"  /> 
  </div>