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

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}); 
    }) 
});