Jquery flashSlider插件实现幻灯效果

一、Html代码

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

 

二、js引用

 <script src="javascript/jquery-1.3.2.min.js" type="text/javascript">script>
 <script src="javascript/jquery.flashSlider-1.0.min.js" type="text/javascript">script>
 <script
 type="text/javascript"

>

        $(document).ready(function
()
 {

            $("#slider"
).flashSlider();
        });
    
script
>

 

三、flashSlider默认值

  //默认值
    $.fn.flashSlider.defaults = {
        controlsShow: true, //是否显示数字导航
        vertical: false, //纵向还是横向滑动
        speed: 800, //滑动速度
        auto: true, //是否自定滑动
        pause: 2000, //两次滑动暂停时间
        easing: "swing", //easing效果，默认swing，更多效果需要easing插件支持
        height: 0, //容器高度，不设置自动获取图片高度
        width: 0//容器宽度，不设置自动获取图片宽度
    }