使用jquery.wmuSlider.js 制作jQuery响应式幻灯片效果
  • 分享到微信朋友圈
    X
立即下载 查看演示

jquery.wmuSlider.js 是一个简化的jQuery响应式滑块，支持触摸操作和AJAX图片库，‌jquery.wmuSlider.js‌ 提供了多种幻灯片效果，包括横向和纵向滑动等。

关键代码

<script src="js/jquery.wmuSlider.js"></script>
<script>
    $('.demo').wmuSlider({
        animation: 'slide'//定义滑动切换时的动画效果
    });         
</script>

参数说明

<script> 
    $('.example1').wmuSlider({ 
            animation: 'fade',//定义滑动切换时的动画效果。
            animationDuration: 600,//动画过渡效果的持续时间
            slideshow: true,//定义自动切换。
            slideshowSpeed: 7000,// 每次循环的持续时间为7000毫秒（7秒）
            slideToStart: 0,//用于设置或获取滑块在动画开始时滑动到其起始位置。
            navigationControl: true,//表示是否显示导航控制。如果设置为 true，则会显示箭头按钮。如果设置为 false，则不会显示箭头按钮。
            paginationControl: true,//用于控制是否显示分页控制按钮。如果设置为 true，则会显示分页控制按钮；如果设置为 false，则不显示分页控制按钮。
            previousText: 'Previous',//上一页按钮文本
            nextText: 'Next',//下一页按钮文本
            touch: false,//触摸事件
            slide: 'article',//轮播内容标签
            items: 1 //允许用户自定义轮播图中的项目数量或内容。
    });  
</script>