ppt轮播效果实现

实现：
实现PPT轮播效果

示例：

<script src="http://www.lanrenzhijia.com/ajaxjs/jquery.min.js" type="text/javascript"></script>
    <script src="/assets/ppt/layer/layer.min.js" type="text/javascript"></script>
    <script src="/assets/ppt/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="/assets/ppt/jcarousel.connected-carousels.css">
    <script type="text/javascript" src="/assets/ppt/jquery.jcarousel.min.js"></script>
    <script type="text/javascript" src="/assets/ppt/jcarousel.connected-carousels.js"></script>
    @if(count($oCasePptImage) > 0)
        <div class="detail_line vedio_box">
            <div class="wrapper">
                <div class="connected-carousels">
                    <div class="stage">
                        <a href="#" class="prev prev-navigation prev-img"></a>
                        <a href="#" class="next next-navigation next-img"></a>
                        <div class="carousel carousel-stage">
                            <ul id="imgs">
                             @foreach($oCasePptImage as $value)
                                <li><img src="{{$value->case_thumb}}" width="461" height="346" alt=""></li>
                             @endforeach   
                            </ul>
                        </div>
                        <a href="#" class="next next-stage"><span>&rsaquo;</span></a>-->
                    </div>

                    <div class="navigation">
                        <a href="#" class="prev prev-navigation prev-img2"></a>
                        <a href="#" class="next next-navigation next-img2"></a>
                        <div class="carousel carousel-navigation">
                            <ul>
                             @foreach($oCasePptImage as $value)
                                <li><img src="{{$value->case_thumb}}" width="98" height="74" alt=""></li>
                             @endforeach   
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
     @endif

效果图：

jcarousel包下载：http://download.csdn.net/download/kirsten_z/10176418