【问题标题】:Foundation 6 Orbit: Change Slide programaticallyFoundation 6 Orbit:以编程方式更改幻灯片
【发布时间】:2016-07-22 19:52:18
【问题描述】:

在基础 6 上。

我有一个轨道滑块,除了默认行为外,它还需要能够在单击外部按钮时更改滑块。

有没有办法让它工作?

我试过这段代码:

jQuery('#theslider').foundation('changeSlide', true, slide_id); 

//slide_id is the jQuery object's slide ex: jQuery(#slideid);

它有点工作,但工作不规律。

它有时会在一段时间内正常工作,但有时幻灯片会快速运行并从屏幕上消失,或者只是冻结。

我似乎无法找到正在发生的事情的模式。

我不是 javascript 方面的专家,所以我可能会遗漏一些非常明显的东西。

【问题讨论】:

  • 滑块有它自己的计时器来滑动到下一个滑块图像。当您实现此功能时,它可以工作,但是当时间到时,它会更改为下一张幻灯片。所以试着用你写的函数来控制定时器。另外,尝试通过 jsfiddle 分享您的代码。

标签: javascript jquery zurb-foundation orbit


【解决方案1】:

我的解决方案如下:

$('.orbit-external-control').on('click', function () {
  var activeIdx = ~~$('.orbit .orbit-bullets .is-active').data('slide')
  var changeIdx = ~~$(this).data('slide')
  var isLTR = (changeIdx > activeIdx) ? true : false

  if (activeIdx ===  changeIdx)
    return

  var chosenSlide = $('.orbit .orbit-slide').filter(function (index) {
    return index === changeIdx
  })

  $('.orbit').foundation('changeSlide', isLTR, chosenSlide, changeIdx) 
})

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-24
    • 1970-01-01
    • 1970-01-01
    • 2019-12-06
    • 2017-12-26
    • 2021-08-24
    相关资源
    最近更新 更多