拖动或滑动时猫头鹰轮播淡入淡出效果不起作用

Posted 2023-05-07

【中文标题】拖动或滑动时猫头鹰轮播淡入淡出效果不起作用

【英文标题】：Owl Carousel fade effect doesn't work when you drag or swipe

【发布时间】：2021-12-29 12:05:05

【问题描述】：

当您单击点或箭头时，淡入淡出效果会正常工作。但是当您滑动或拖动时，它会滑动。我怎样才能使拖拽的淡入淡出效果呢？

您可以在 Owl Carousel 演示中看到一个示例：https://owlcarousel2.github.io/OwlCarousel2/demos/animate.html - 当您单击点时 - 它会消失，但当您拖动时 - 它会滑动。

【参考方案1】：

仅通过 css，例如：

.owl-item 
    opacity: 0.4;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;

.owl-item.active 
    opacity: 1;

但视觉上会出现滑动/滑动，但新的幻灯片会出现效果。 您还可以通过选项禁用拖动：

mouseDrag: false,
touchDrag: false,