重新初始化现有的jQuery flexslider了新的选择 [英] Reinitialise existing jQuery flexslider with new options

问题描述

我用 $（文件）。就绪加载脚本：

  $（文件）。就绪（函数（）{
    $（'。flexslider'）。flexslider（{
       动画：褪色，
       controlsContainer：.flexslider
    }）;
}）;
 

接下来，我想通过按钮来更改选项动漫：

 ＆LT; D​​IV CLASS =集装箱span12菜单＆GT;
    ＆LT;一个ID =链接褪色级=menubtn的href =＃＆GT;＆FADE LT; / A＆GT;
    ＆LT;一个ID =链接幻灯片级=menubtn的href =＃＆GT;载玻片LT; / A＆GT;
＆LT; / DIV＆GT;
 

但是这不工作：

  $（文件）。就绪（函数（）{
    $（'＃链接褪色'）。点击（函数（）{
        $（'。flexslider'）。flexslider（{
            动画：褪色，
            controlsContainer：.flexslider
        }）;
        返回false;
    }）;
    $（'＃链接幻灯片'）。点击（函数（）{
        $（'。flexslider'）。flexslider（{
            动画：'滑'，
            controlsContainer：.flexslider
        }）;
        返回false;
    }）;
}）;
 

解决方案

在我看来这样做是删除整个元素，创造新的，并呼吁用新flexslider功能的唯一途径。 动画参数仅widget的初始化期间使用。

I used $(document).ready to load script:

$(document).ready(function (){
    $('.flexslider').flexslider({
       animation: 'fade',
       controlsContainer: '.flexslider'
    });
});

Next I want to change option "animation" by buttons:

<div class="container span12 menu">
    <a id="link-fade" class="menubtn" href="#">FADE</a>
    <a id="link-slide" class="menubtn" href="#">SLIDE</a>
</div>

but this not working:

$(document).ready(function (){
    $('#link-fade').click(function(){
        $('.flexslider').flexslider({
            animation: 'fade',
            controlsContainer: '.flexslider'
        });
        return false;
    });
    $('#link-slide').click(function(){
        $('.flexslider').flexslider({
            animation: 'slide',
            controlsContainer: '.flexslider'
        });
        return false;
    });
});

解决方案

In my opinion the only way to do it is remove whole element, create new one and call flexslider function with new one. "animation" parameter is used only during initialization of widget.

这篇关于重新初始化现有的jQuery flexslider了新的选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！