【问题标题】:On clicking element restart Glide.js单击元素重新启动 Glide.js
【发布时间】:2015-11-12 23:39:46
【问题描述】:

我有一个灯箱,里面有一个滑动滑块。 Glide.js 已经启动。我想单击我指定的元素以重新启动滑块。关闭灯箱时,我想暂停滑块。我可以看到 API 可以做到这一点,但无法让它工作......

我的滑块设置

var slider_alt=$("#glide--alt").glide({
    type:"slideshow",
    autoplay:2500, 
    animationDuration:2000,
    hoverpause:false
}),
slider_api=slider_alt.data("glide_api");

我的 jQuery 尝试重新启动滑块

popUp_openButton.click(function(){
    slider_alt.jump(1);
    slider_alt.play();
});

popUp_closeButton.click(function(){ 
    slider_alt.pause();
}); 

【问题讨论】:

    标签: javascript jquery css slider glidejs


    【解决方案1】:

    使用.refresh():

    popUp_closeButton.click(function(){ 
       slider_alt.refresh();
    });
    

    【讨论】:

    • @Anders 它应该是 .refresh();而不是:对吗?
    • 非常感谢@Anders & Sree。我设法让它解决问题。使用变量slider_alt 不起作用...
    【解决方案2】:

    这是我的最终工作代码。在打开模式窗口时,滑块会重新计算并从幻灯片 1 开始。在关闭其停止时清除所有对象和绑定。

    //Setting up slider
    var slider_alt=$("#glide--alt").glide({
        type:"slideshow",
        autoplay:2500, 
        animationDuration:2000,
        hoverpause:false
    }),
    slider_alt_api=slider_alt.data("glide_api");
    
    
    var popUp_openButton    = $('.popUp__button--open'),
    popUp_closeButton   = $('.popUp__button--close');
    
    popUp_openButton.click(function(){
        slider_alt_api.refresh();
        slider_alt_api.jump('=1');
    });
    
    popUp_closeButton.click(function(){ 
        slider_alt_api.destroy();
    });     
    
    $(document).keyup(function(e){
        if(e.keyCode === 27) {
            slider_alt_api.destroy();
        }  
    }); 
    

    【讨论】:

      猜你喜欢
      • 2012-02-05
      • 1970-01-01
      • 2021-07-21
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多