修改Flexslider缩略图Translate3d

Question

我正在使用的Wordpress中的flexslider旨在镜像：http://flexslider.woothemes.com/thumbnail-slider.html

通过使用ACF，我设法像这样设置它：

几乎在那儿，但是我发现缩略图滑块移得太远了，您可以看到我在当前图像缩略图所在的位置上方红色圆圈的位置，并且应该在视图中显示更多。

以下是上面的滑块部分的代码：

<div id="carousel" class="flexslider">
<div class="flex-viewport" style="overflow: hidden; position: relative;">
    <ul class="slides" style="width: 1200%; transition-duration: 0.6s; transform: translate3d(0px, 0px, 0px);">
        <li class="flexslider-image-thumb flex-active-slide" style="width: 190px; margin-right: 5px; float: left; display: block;">
            <img src="wp-content/uploads/2018/06/FD045PACA2-300x191.jpg" alt="" class="flexslider-thumb-slider-image" draggable="false">
        </li>
        <li class="flexslider-image-thumb" style="width: 190px; margin-right: 5px; float: left; display: block;">
            <img src="wp-content/uploads/2018/06/HOL055PACA-300x191.jpg" alt="" class="flexslider-thumb-slider-image" draggable="false">
        </li>
        <li class="flexslider-image-thumb" style="width: 190px; margin-right: 5px; float: left; display: block;">
            <img src="wp-content/uploads/2018/06/HOL055PACM-FTF-300x191.jpg" alt="" class="flexslider-thumb-slider-image" draggable="false">
        </li>
        <li class="flexslider-image-thumb" style="width: 190px; margin-right: 5px; float: left; display: block;">
            <img src="wp-content/uploads/2018/06/MAZ034PACMK-300x191.jpg" alt="" class="flexslider-thumb-slider-image" draggable="false">
        </li>
        <li class="flexslider-image-thumb" style="width: 190px; margin-right: 5px; float: left; display: block;">
            <img src="wp-content/uploads/2018/06/MIT039PACMD2K-300x191.jpg" alt="" class="flexslider-thumb-slider-image" draggable="false">
        </li>
        <li class="flexslider-image-thumb" style="width: 190px; margin-right: 5px; float: left; display: block;">
            <img src="wp-content/uploads/2018/06/NIS046PACA2K-300x191.jpg" alt="" class="flexslider-thumb-slider-image" draggable="false">
        </li>
    </ul>
</div>
<ul class="flex-direction-nav">
    <li class="flex-nav-prev">
        <a class="flex-prev flex-disabled" href="#" tabindex="-1">
            Previous
        </a>
    </li>
    <li class="flex-nav-next">
        <a class="flex-next" href="#">
            Next
        </a>
    </li>
</ul>
</div>

我注意到，translate3d移动了相当数量，滑块中有6张图像，转换值如下：

• 0px，0px，0px
• -430px，0px，0px
• -823px，0px，0px

如果我能够将它们分别减小到-230px和-423px，则问题将基本得到解决。我看了一下flexslider js脚本，但是我只能找到的是这个：

 if (slider.transitions) {
    if (slider.isFirefox) {
      target = (vertical) ? "translate3d(0," + target + ",0)" : "translate3d(" + (parseInt(target)+'px') + ",0,0)";
    } else {
      target = (vertical) ? "translate3d(0," + target + ",0)" : "translate3d(" + ((slider.vars.rtl?-1:1)*parseInt(target)+'px') + ",0,0)";
    }
    dur = (dur !== undefined) ? (dur/1000) + "s" : "0s";
    slider.container.css("-" + slider.pfx + "-transition-duration", dur);
     slider.container.css("transition-duration", dur);
  }

不幸的是，在这里修改值对我没有任何帮助，因此我对如何进行操作有些困惑。有人能帮我吗？

谢谢。