当前位置: 首页 > 工具软件 > Owl Carousel > 使用案例 >

Owl Carousel插件回调函数不起作用/失效解决方案

姚飞昂
2023-12-01

临时改一个老项目,里面有一个幻灯片的功能用的插件是Owl Carousel
幻灯片里面嵌套的是video,想要实现的功能在每次移动后,如果视频是播放状态就关闭。
但是回调函数各种不起作用,最后翻资料找到解决方案。

出了一个新版本,建议直接Owl Carousel 2新版本

解决方案

  1. 可参考回调函数类型 – 官网参考地址
·initialize.owl.carousel     // 初始化
·initialized.owl.carousel 
·resize.owl.carousel    // resize
·resized.owl.carousel
·refresh.owl.carousel     // 刷新
·refreshed.owl.carousel
·update.owl.carousel   // update
·updated.owl.carousel
·drag.owl.carousel   // 拖动
·dragged.owl.carousel
·translate.owl.carousel   // translate
·translated.owl.carousel
·to.owl.carousel  // 跳转
·changed.owl.carousel  // change
  1. 回调方法
		var owl = jQuery("#owl-carousel");
		// .on('回调类型')
         owl.on(' translated.owl.carousel', function(e) {
             // 回调处理
         }).owlCarousel({
             center: true,
             items: 4,
             loop: true,
             margin: 30,
         });

未能起作用的回调函数

错误写法

   jQuery("#owl-carousel").owlCarousel({
             center: true,
             items: 4,
             loop: true,
             margin: 30,
             afterMove: function(elem) {
                 alert(1);
             }
         });

回调函数

变量 类型 默认值 说明

beforeUpdate 函数 false 响应之后的回调函数

afterUpdate 函数 false 响应之前的回调函数

beforeInit 函数 false 初始化之前的回调函数

afterInit 函数 false 初始化之后的回调函数

beforeMove 函数 false 移动之前的回调函数

afterMove 函数 false 移动之后的回调函数

afterAction 函数 false 初始化之后的回调函数

startDragging 函数 false 拖动的回调函数

afterLazyLoad 函数 false 延迟加载之后的回调函数

如果不是菜,我就自己写轮子了 哎~~

 类似资料: