jQuery淡入淡出带缩略图的轮播插件

轮播图片和分页html代码

<div id="ei-slider" class="ei-slider"> 
    <ul class="ei-slider-large"> 
        <li>
            <img src="images/large/4.jpg" alt="image04" />
            <div class="ei-title">
                <h2>
                    <a href='http://www.sucaihuo.com/js/250.html' target='_blank'>手风琴菜单</a>
                </h2>
                <h3>
                    手风琴
                </h3>
            </div>
        </li>
        <li>
            <img src="images/large/1.jpg" alt="image01" />
            <div class="ei-title">
                <h2>
                    <a href='http://www.sucaihuo.com/js/251.html' target='_blank'>时间轴</a>
                </h2>
                <h3>
                    jqtimelin
                </h3>
            </div>
        </li>
        <li>
            <img src="images/large/5.jpg" alt="image05" />
            <div class="ei-title">
                <h2>
                    <a href='http://www.sucaihuo.com/js/252.html' target='_blank'>Combo Select</a>
                </h2>
                <h3>
                    SELECT搜索插件
                </h3>
            </div>
        </li>

    </ul> 
    <ul class="ei-slider-thumbs"> 
        <li class="ei-slider-element">Current</li> 
        <li><a href="#">Slide 1</a><img src="images/thumbs/1.jpg" alt="thumb01" /></li> 
        <li><a href="#">Slide 2</a><img src="images/thumbs/2.jpg" alt="thumb02" /></li> 
        <li><a href="#">Slide 3</a><img src="images/thumbs/3.jpg" alt="thumb03" /></li> 
    </ul> 
</div>

引入eislideshow响应式轮播插件

<script type="text/javascript" src="js/jquery.eislideshow.js"></script> 
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>

<script type="text/javascript">
    $(function() {
        $('#ei-slider').eislideshow({
            easing: 'easeOutExpo',
            titleeasing: 'easeOutExpo',
            titlespeed: 1200
        });
    });
</script>