Javascript 从外部元素控制Flexslider。

我想从元素外部控制一个FlexSlider。我试过这个：

var myslider = $('.slider').flexslider({
    animation: 'slide'
});

$('button').click(function () {
    myslider.flexAnimate(3)    //Function: Move slider - (target, pause) parameters
});

但返回的是

TypeError:Object[Object Object]没有方法“flexAnimate”

然后我偶然发现了这根线(https://github.com/woothemes/FlexSlider/issues/125)这表明这是正确的方法：

$('button').click(function () {
    myslider.flexslider(3)
});

但是，我不知道如何指定动画的速度。我只希望该事件的更改是即时的

我想我想知道如何从slider元素外部访问文档中提到的SliderAPI

slider                        //Object: The slider element itself
slider.container              //Object: The ul.slides within the slider
slider.slides                 //Object: The slides of the slider
slider.count                  //Int: The total number of slides in the slider
slider.currentSlide           //Int: The slide currently being shown
slider.animatingTo            //Int: Useful in .before(), the slide currently animating to
slider.animating              //Boolean: is slider animating?
slider.atEnd                  //Boolean: is the slider at either end?
slider.manualPause            //Boolean: force slider to stay paused during pauseOnHover event
slider.controlNav             //Object: The slider controlNav
slider.directionNav           //Object: The slider directionNav
slider.controlsContainer      //Object: The controlsContainer element of the slider
slider.manualControls         //Object: The manualControls element of the slider
slider.flexAnimate(target)    //Function: Move slider - (target, pause) parameters
slider.pause()                //Function: Pause slider slideshow interval
slider.resume()               //Function: Resume slider slideshow interval
slider.canAdvance(target)     //Function: returns boolean if slider can advance - (target) parameter
slider.getTarget(dir)         //Function: get target given a direction - "next" or "prev" parameter

使用最新（2.1）版本的Flexslider，您可以使用如下外部api：

$('button').click(function () {
    $('.slider').flexslider(3);
});

---

API的完整详细信息位于

您可以访问滑块对象，如下所示：

var exampleSlider = $('#slider').data('flexslider');
// now you can access all the methods for example flexAnimate
exampleSlider.flexAnimate(..);

---

如上所述，您可以在（source:）的API描述中找到这一点。

这一点对我很有用：

    $('#slider').flexslider({
        animation: "slide",
        controlNav: false,
        animationLoop: false,
        slideshow: false,
        start: function(){
            $('#sliderNext').on('click', function(e){
                $('.flex-next').trigger('click');
            });
            $('#sliderPrev').on('click', function(e){
                $('.flex-prev').trigger('click');
            });
        }
    });

---

还没有人回答这个主要问题：如何在没有动画的情况下在特定幻灯片上启动lightbox中的flexslider，但随后在幻灯片之间设置动画。我已经这样解决了这个问题：

var exampleSlider = $('#slider').data('flexslider');
// now you can access all the methods for example flexAnimate
exampleSlider.flexAnimate(..);

在打开lightbox（使用lightbox回调）之前，我将flexslider的动画速度设置为0：

self.$slider.data('flexslider').vars.animationSpeed = 0;

打开lightbox（使用lightbox回调）后，我更改flexslider索引并返回动画速度的上一个值：

self.$slider.flexslider(this.index);
self.$slider.data('flexslider').vars.animationSpeed = 600; 

那对我有用。虽然我用了不同的格式

var img = $('<span/>');
img.attr('onclick','myslider.flexslider('+ id + ');');

var img=$（''）；
img.attr（'onclick'，'myslider.flexslider（'+id+'）；'）；

---

我有很多从数据库加载的幻灯片

您可以先尝试设置滑块对象：

$slider = $('.slideshow').flexslider();

然后使用flexslider的公共方法：

$slider.data('flexslider').pause();
$slider.data('flexslider').play();

---

对这是可行的，但我希望更改是即时的（无幻灯片转换）。我用这个函数启动灯箱中的滑块，用户单击图像的一个卷尾，所以当灯箱打开时，我不希望滑块处于中间过渡。但是，当我在滑块中导航时，我需要过渡效果。这可能吗？flexAnimate的文档在哪里？我在github的报告里找不到，嗨！我正努力按照你说的去做。但切换到另一张幻灯片后，我的图像消失了。只有移动到上一张幻灯片，图像才会恢复。有什么想法吗？也许你可以分享一些示例代码？非常感谢！Alexandr Solovyov是否可以发布一个示例？？以下是示例要点：。我已经在这里实现了：Yuriy，谢谢！这帮了大忙！一点评论。要使此代码与slide flexslider动画一起工作，您应该添加$（window.trigger（'resize'）；在更换幻灯片之前。