jQuery焦点轮播图

所属分类:媒体-幻灯片和轮播图

 17482  55  查看评论 (5)
分享到微信朋友圈
X
jQuery焦点轮播图 ie兼容12

更新时间:2021-12-12 22:12:30

更新说明:修改轮播抖动问题


更新时间:2021-12-02 00:47:08

使用方法

引入jquery,引入mySlider.js文件

<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/mySlider.js"></script>

结构相同,类名可以随意更改

new Slider({
    oSliderWrap: $('.J_sliderWrap'),
    sliderItems: $('.item'),
    yuan: $('.yuan'),
    yuanItems: $('.yuan-item'),
    btnGroupLeft: $('.btn-left'),
    btnGroupRight: $('.btn-right')
}).init();
相关插件-幻灯片和轮播图

可拖动的轮播插件(视频存在进度条,swiper插件)

可以拖拽实现切换图片,可以将图片和视频一起实现滑动。视频存在进度条,进度条完毕,实现切换
  幻灯片和轮播图
 45811  379

jquery实现图片浏览类似qq空间图片查看

利用layer.min.js插件进行实现
  幻灯片和轮播图
 39307  351

iSlider手机端图片滑动切换插件

iSlider.js手机幻灯片代码制作手指滑动手机端图片轮播代码
  幻灯片和轮播图
 82869  497

可嵌入图片全屏滑动

可嵌入图片视频jQuery全屏滑块
  幻灯片和轮播图
 33150  455

讨论这个项目(5)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    VISSONIC议朗_燕辉 0
    2022/3/31 18:10:26
    大佬,这个轮播小点点在悬停时画面会白屏或者半透明,这种怎么解决,可以修复下bug吗,非常需要🌹
        getter0
        2022/3/31 19:13:52
        你不说我没发现
        getter1
        2022/3/31 19:17:46
        //图片切换
        _slideAction: function(idx) {
            this.sliderItems.eq(idx).stop(true, true).fadeIn(500)
                .siblings().stop(true, true).fadeOut(500);
            this.yuanItems.eq(idx).addClass('cur')
                .siblings().removeClass('cur');
        },

        stop里面添加两个参数 ,都为true,应该就可以了
        第一个参数表示规定是否停止被选元素的所有加入队列的动画。
        第二个参数表示规定是否允许完成当前的动画。

    回复
    天河 0
    2022/3/21 15:16:03
    不支持IE?
        getter0
        2022/3/31 19:18:11
        没写😥
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复