图片滚动效果

HTML效果
```html
<div class="picScroll box">
                <ul>
                    <li >
                        <div class="box-img">
                            <img src="{$temp_css}/images/4.png">
                        </div>
                        <h3>产品服务</h3>
                    </li>
                    <li >
                        <div class="box-img">
                            <img src="{$temp_css}/images/4.png">
                        </div>
                        <h3>产品服务</h3>
                    </li>
                    <li>
                        <div class="box-img">
                            <img src="{$temp_css}/images/4.png">
                        </div>
                        <h3>产品服务</h3>
                    </li>
                    <li>
                        <div class="box-img">
                            <img src="{$temp_css}/images/4.png">
                        </div>
                        <h3>产品服务</h3>
                    </li>
                    <li>
                        <div class="box-img">
                            <img src="{$temp_css}/images/4.png">
                        </div>
                        <h3>产品服务</h3>
                    </li>
                    <li>
                        <div class="box-img">
                            <img src="{$temp_css}/images/4.png">
                        </div>
                        <h3>产品服务</h3>
                    </li>
                </ul>
                <a class="prev" href="javascript:void(0)"><i class="iconfont icon-icon-test31"><</i></a>
                <a class="next" href="javascript:void(0)"><i class="iconfont icon-icon-test33">></i></a>
            </div>
```
JS调用
```html
<script src="https://hbsjsd.oss-cn-zhangjiakou.aliyuncs.com/js/jquery-1.11.0.js"></script>
<script type="text/javascript" src="{$temp_css}/js/jquery.SuperSlide.2.1.js"></script>
```
页面调用
```html
    jQuery(".picScroll").slide({
        mainCell: "ul",
        effect: "leftLoop",
        vis: 6,
        scroll: 1,
        autoPage: true,
        switchLoad: "_src",
        autoPlay: true
    });
```
CSS样式
```css

.picScroll {
  margin: 0px auto;
  position: relative;text-align: center;
  border: 0px solid #eee;
  overflow: hidden;
  min-width: 320px;max-width: 100%;
}
.picScroll .prev {
  display: inline-block;
  width: 36px;line-height: 36px;
  height: 36px; border: #333 solid 1px; margin-top:15px;

}
.picScroll ul{width: 100%;float: left;}
.picScroll .next {
  display: inline-block;
  width: 36px;line-height: 36px;
  height: 36px; border: #333 solid 1px;margin-top:15px;
}
.picScroll ul li {
  width: 33.33%;
  float: left;
  overflow: hidden;
  margin: 0 10px;
  background: #FFFFFF;padding-bottom: 10px;
}
```

速建时代TPCMS管理系统

图片滚动效果