Question

我正在创建一个滑块，它与zurb的轨道滑块一起运行。这一点是我想控制两个带有一组导航箭头的幻灯片...这就是我要添加到orbit.next函数中的内容：

$('.description > p:visible')
  .fadeOut(500)
  .next()
  .fadeIn(500)
  .end()
  .appendTo('.description');

这是下一个箭头的代码，但我如何调整此代码，以便它也适用于上一个箭头？

由于
本

Answer 1

我真的不知道轨道滑块，但我想我可以帮助某种程度，这是我到目前为止所做的

$('.description p:last-fo-type')
  .fadeOut(500)
  .prev()
  .fadeIn(500)
  .end()
  .prependTo('.description');

如果我误解了什么，请告诉我。所以我可以进行必要的更正。

祝你好运。

Answer 2

我已经明白了......

  this.$element.bind('orbit.next', function () {
    self.shift('next');

    if ($('.description > p:visible').is(':not(:last-of-type)')) {
      $('.description > p:visible').fadeOut(500).next().fadeIn(500);
    } else {
      $('.description > p:visible').fadeOut(500);
      $('.description > p:first').fadeIn(500);
    }
  });

  this.$element.bind('orbit.prev', function () {
    self.shift('prev');
    if ($('.description > p:visible').is(':not(:first-of-type)')) {
      $('.description > p:visible').fadeOut(500).prev().fadeIn(500);
    } else {
      $('.description > p:visible').fadeOut(500);
      $('.description > p:last').fadeIn(500);
    }
  });

带箭头的滑块

2 个答案: