Flexslider 暂停按钮答案

【问题标题】：Flexslider pause buttonFlexslider 暂停按钮
【发布时间】：2012-06-18 19:06:02
【问题描述】：

我正在尝试暂停使用 flexslider。这是我正在使用的代码。

$(window).load(function() {
$('.flexslider').flexslider({
    slideshowSpeed: 3000,
    animationDuration: 1100,
    directionNav: false,
    controlNav: true,
    pausePlay: true,
    pauseText: 'Pause',
    playText: 'Play', 

});
});

它只显示暂停的元素和文本，但不影响任何内容。我做错了什么？

编辑：

查看 flexslider 代码，我认为这一定是处理按钮的部分。实际代码有点过头了，但我看不到任何看起来像点击事件处理程序的东西。

      //////////////////////////////////////////////////////////////////

  //////////////////////////////////////////////////////////////////
  //FlexSlider: Pause/Play
  if (slider.vars.pausePlay) {
    var pausePlayScaffold = $('<div class="flex-pauseplay"><span></span></div>');

    if (slider.containerExists) {
      slider.controlsContainer.append(pausePlayScaffold);
      slider.pausePlay = $('.flex-pauseplay span', slider.controlsContainer);
    } else {
      slider.append(pausePlayScaffold);
      slider.pausePlay = $('.flex-pauseplay span', slider);
    }

    var pausePlayState = (slider.vars.slideshow) ? 'pause' : 'play';
    slider.pausePlay.addClass(pausePlayState).text((pausePlayState == 'pause') ? slider.vars.pauseText : slider.vars.playText);

    slider.pausePlay.bind(slider.eventType, function(event) {
      event.preventDefault();
      if ($(this).hasClass('pause')) {
        slider.pause();
        slider.manualPause = true;
      } else {
        slider.resume();
        slider.manualPause = false;
      }
    });
  }

【问题讨论】：

你有一个 URL 来实现这个吗？
我发现了问题。出于某种原因，我的 flex-control-nav 列表阻止了点击事件，它一定是覆盖了 flex-pauseplay div。我想我会把它放在一个答案中，并为处于类似情况的任何人接受它，因为移动这些控制元素很常见。
有趣的是，你知道我想过，但后来我没有说 - 这就是为什么我要求一个现场网站...下次我要说出我的想法:)

标签： javascript jquery flexslider

【解决方案1】：

原来问题出在我的 CSS 上。我已经移动了 flex-control-nav 有序列表，它似乎阻止了点击事件，它一定是覆盖了 flex-pauseplay div。

【讨论】：