как использовать публичные методы bxslider => goToNextSlide () не является функцией

Question

У меня небольшая проблема с публичными методами bxSlider. Чего я хочу добиться, так это возможности вертикальной прокрутки колесиком мыши между слайдами. Что бы я ни пытался, я всегда получаю «goToNextSlide () не является функцией» или «goToPrevSlide () не является функцией» ...

Я работаю в среде WordPress с той же версией jQuery, как упомянуто в Pen ниже и той же версией bxslider ... Я действительно не понимаю, почему она не работает.

Я уже пытался определить глобальную переменную «ползунок», потому что прочитал, что это может быть проблемой, но она не работает ...

Вот мой код. У меня все еще есть небольшая проблема, если вы прокручиваете слишком быстрые разрывы скриптов, но я исправлю это позже:

$(document).ready(function(){

var slider = $('.bxslider').bxSlider({
        pager: false,
        mode: "vertical",
        easing: 'linear',
        speed: 300,
        adaptiveHeight: true,
        infiniteLoop: false,
        autoStart: false,
        nextText: '',
        prevText: '',
        minSlides: 1,
        maxSlides: 4,
        controls: true,
        onSliderLoad: function () {
            $('#marcel-driver-zoe .bxslider').find('.SliderItem:nth-child(2)').find('#SliderBG').addClass('gradient');
        },
        onSlideNext: function ($slideElement, oldIndex, newIndex) {
            $('#marcel-driver-zoe .bxslider').find('.SliderItem:nth-child(2)').find('#SliderBG').removeClass('gradient');
            $('#marcel-driver-zoe .bxslider').find('.SliderItem:nth-child(3)').find('#SliderBG').addClass('gradient');
            $('#marcel-driver-zoe .bxslider').find('.SliderItem:last-child').find('#SliderBG').addClass('gradient');
            $slideElement.find('#SliderBG').removeClass('gradient');
            $('#marcel-driver-zoe .bxslider').find('.SliderItem').eq(oldIndex).find('#SliderBG').addClass('gradient');
        },
        onSlidePrev: function ($slideElement, oldIndex, newIndex) {
            $('#marcel-driver-zoe .bxslider').find('.SliderItem:nth-child(3)').find('#SliderBG').removeClass('gradient');
            $('#marcel-driver-zoe .bxslider').find('.SliderItem:last-child').find('#SliderBG').addClass('gradient');
            $('#marcel-driver-zoe .bxslider').find('.SliderItem').eq(newIndex).find('#SliderBG').removeClass('gradient');
            $('#marcel-driver-zoe .bxslider').find('.SliderItem').eq(oldIndex).find('#SliderBG').addClass('gradient');
        }
    });

    $('.bxslider').bind('mousewheel DOMMouseScroll', function (event) {
        if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) {
            slider.goToPrevSlide();
        } else {
            slider.goToNextSlide();
        }
    });
});

Я сделал кодовую ручку прямо здесь, которая отлично работает, но не на моем сайте ... https://codepen.io/r0mpr/pen/Nmoxyj

Если бы кто-нибудь мог оказать некоторую помощь, было бы здорово. Большое спасибо.