Question

我已经尝试交换owl.carousel.js上的函数，但它只在鼠标移动时才有效。

var Autoplay = function(scope) {
this.core = scope;
this.core.options = $.extend({}, Autoplay.Defaults, this.core.options);

this.handlers = {
    'translated.owl.carousel refreshed.owl.carousel': $.proxy(function() {
        this.autoplay();
    }, this),
    'play.owl.autoplay': $.proxy(function(e, t, s) {
        this.play(t, s);
    }, this),
    'stop.owl.autoplay': $.proxy(function() {
        this.stop();
    }, this),
    'mouseover.owl.autoplay': $.proxy(function() {
        if (this.core.settings.autoplayHoverPause) {
            this.pause();
        }
    }, this),
    'mouseleave.owl.autoplay': $.proxy(function() {
        if (this.core.settings.autoplayHoverPause) {
            this.autoplay();
        }
    }, this)
};

this.core.$element.on(this.handlers);};

任何想法如何在鼠标悬停在图像上时使幻灯片显示工作？

Answer 1

当我遇到这个问题时，我使用了这段代码：

$（＆＃39; .owl-carousel .owl-dot＆＃39;）。hover（function（）{
   $（本）。点击（）;
  }，
  function（）{}
）;

这里是我的css for dots：
.owl-dot {
    位置：相对;
    填充：0;
    身高：3px;
    保证金：0;
    向左飘浮;
} .owl-dot：之前{
    内容：＆＃34;＆＃34 ;;
    位置：绝对;
    上：-168px;
//图像的高度     身高：168px;
//图像的高度     宽度：100％;
    左：0;
    z-index：0;
}

当你将鼠标悬停在圆点上时，图像会发生变化，这就是全部!!!

Owl Carousel 2 - 悬停时无法更改幻灯片

1 个答案: