jQuery幻灯片插件Sudo Slider演示

使用方法

引入文件

<script type="Text/Javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.sudoSlider.min.js"></script>

Javascript

<script type="text/javascript" >
    $(document).ready(function(){
        $("#slider").sudoSlider({
            numeric:true
        });
    });
</script>

CSS

#slider {
    width:696px;
}
#slider img{
    border:none;
}
#slider ul, #slider li{
    margin:0;
    padding:0;
    list-style:none;
}
#slider li {
    width:696px;
    overflow:hidden;
}

HTML

<div id="slider" >
    <ul>
        <li><img src="images/01.jpg" alt="image description"/></li>
        <li><img src="images/02.jpg" alt="image description"/></li>
        <li><img src="images/03.jpg" alt="image description"/></li>
        <li><img src="images/04.jpg" alt="image description"/></li>
        <li><img src="images/05.jpg" alt="image description"/></li>
    </ul>
</div>