javascript - Foundation 6 Orbit 在元素点击时开始自动播放

Question

我似乎没有找到用于此的控件，例如使用显示模态，我可以在其中为任何元素提供数据显示。我想要实现的是在不自动播放的情况下加载页面，然后在按钮上设置轨道播放。到目前为止，我尝试使用 data-autoplay=true/false 和 data-timer-delay= really high/2000 来欺骗它

$('#startOrbit').click(function(){

    $('.orbit').attr('data-timer-delay',2000);
  });

所以 attr 进入但轨道没有开始......我可以使用哪些选项组合？谢谢

Answer 1

我创建了一个代码笔示例 ( link )，其中包含一个轨道示例 slider 和您想要实现的功能。

$(document).ready(function() {
    var elem = new Foundation.Orbit($('.orbit'), {'autoPlay': false});

    $('#startOrbit').on('click', function() {
        elem.options.autoPlay = true;
        elem.options.timerDelay = 2000;
        $('.orbit').foundation('geoSync');
    });
});

首先，我将自动播放选项设置为 false 来初始化轨道 slider 。然后我在带有#startOrbit id 的按钮元素上附加一个点击事件监听器，更改两个选项，最后调用在轨道上设置计时器对象并启动下一张幻灯片的计数器的 geoSync 方法。