Question

我正在使用一些不同的jQuery幻灯片，我想到了一个介绍幻灯片。一旦访问者看到幻灯片并阅读它，信息就没用了。以jQuery Cycle为例，如何在访问者导航到“幻灯片2”后删除“幻灯片1”。

我希望让这种方法起作用，而不是使用弹出窗口或计时器功能来移除幻灯片。

有什么想法吗？

Answer 1

我认为这篇文章会对你有帮助。在这里，他们给出了一个示例代码，用于在jQuery循环插件中添加/删除幻灯片中的幻灯片。

http://forum.jquery.com/topic/jquery-jquery-cycle-remove-slide

Answer 2

就我所知，目前还没有办法做得很好。 jQuery Cycle插件在调用时会初始化它将切换的所有元素。还有其他需要考虑的后果，比如你是否正在使用寻呼机，删除后第一个会发生什么？我认为你最好的选择是使用标准的jQuery动画效果，并在其回调中启动你的幻灯片。

所以这是两个解决方案。首先，在回调时调用自身的jQuery循环会破坏自身，然后重新启动。

http://jsfiddle.net/RQapW/2/

$('div').cycle({
    timeout: 500,
    after: myFunction
});

function myFunction(currSlideElement, nextSlideElement, options, forwardFlag) {
    console.log(currSlideElement.src + ' : ' + nextSlideElement.src);

    //if we are on the second slide then remove the first one and restart slideshow
    if (currSlideElement == $('img')[0] && nextSlideElement == $('img')[1]) {
        $('div').cycle('destroy');
        $(currSlideElement).remove();
        $('div').cycle({
            timeout: 500,
        });    
    }
}

只需使用典型的jQuery动画效果。

http://jsfiddle.net/RQapW/

$('img.first').load( function() {
    $(this).fadeOut(5000, function() {
        $(this).remove();
        $('body').cycle({timeout: 500});
    })
});

查看后从幻灯片中删除jQuery幻灯片

2 个答案: