Jquery Cycle Plugin,内容更改时更新滑块,问题!

时间:2011-07-18 17:20:02

标签: javascript jquery jquery-plugins cycle

我刚尝试了Mike Alsup的Cycle Plugin。对于我正在构建的页面来说,似乎很简单。但现在,我遇到了一个问题。

我将Cycle应用于图像列表。现在,我试图破坏并重新应用插件,但没有成功。

当内容发生变化时我触发('destroy');并再次使用以下内容应用插件:

$('#slides').cycle('destroy'); 

$('#slides').cycle({ 
    fx:     'fade', 
    speed:  'fast', 
    timeout: 0, 
    next:   '#next', 
    prev:   '#prev' 
});

这适用于:

<div id="display">

    <a href="#" id="prev">Previous</a>
    <a href="#" id="next">Next</a>  

    <div class="imgcontainer">
        <ul id="slides">
            > List of images to go into slideshow. <
        </ul>
    </div>

    <div class="infocontainer">
        <h2> Object title </h2>
        <p> Object information </p>
    </div>
</div>

在我更新滑块后尝试更改图像之前,一切似乎都很好:

  

TypeError:'null'不是对象(评估'p.cycleTimeout')

整个javascript;

$('#projects > li').click(function(){

        var a = $(this);

        $('#display .imgcontainer ul').html((a).children('ul.images').html());
        $('#display .infocontainer h2').html((a).children('h2').html());
        $('#display .infocontainer p').html((a).children('p').html());

        if(!$(a).hasClass('sub'))
        {
            var title = $(this).attr('title');
            $(a).siblings("[title='" + title + "']").toggle();
        }

        var imgcount = $('.imgcontainer li').size();


        // Only apply plugin if there's more than one image in the list.
        if(imgcount > 1)
        {
            $('#slides').cycle('destroy'); 

            $('#slides').cycle({ 
                fx:     'fade', 
                speed:  'fast', 
                timeout: 0, 
                next:   '#next', 
                prev:   '#prev' 
            }); 
        }
    });

1 个答案:

答案 0 :(得分:1)

第一次通过,即使从未应用过循环,你也称之为“毁灭”。这可能是你的错误来自的地方。

无论如何,你不应该这样做。 Cycle具有专门用于此目的的addSlide功能。参见示例: