Question

我已经使用jcarousel构建了一个幻灯片，我希望在幻灯片中幻灯片转换后让文本动画化。所以幻灯片首先出现，然后文本在之后动画。

我一直试图找出如何使用回调功能，这样每当幻灯片“点击”它就会触发一些文本动画。但是我还没有发现任何可行的东西。

我想要做的是与此处描述的类似：jQuery cycle for text animation on a slideshow

我已经研究过使用'ScrollIntoView'插件，但不认为它符合我的意图。

有人知道如何实现这个目标吗？

非常感谢

Answer 1

我会使用targetin和targetout事件侦听器执行此操作。 jcarousel事件的文档：http://sorgalla.com/jcarousel/docs/reference/events.html

您还可以尝试visiblein和visibleout

如果每张幻灯片中都有文本元素，请设置示例：

$('.jcarousel')
    .on('jcarousel:targetin', 'li', function() {
        // "this" refers to the item element
        // "carousel" is the jCarousel instance
        var $slide = $(this);
        $slide.removeClass('active-slide');

        //sudo code, but put animations here
        $slide.find('.text-effect-element').animate();
    })
    .on('jcarousel:targetout', 'li', function() {
        // "this" refers to the item element
        // "carousel" is the jCarousel instance
        var $slide = $(this);
        $slide.removeClass('active-slide');

        //sudo code, but put animations here
        $slide.find('.text-effect-element').animate();
    });

您还可以使用取决于父幻灯片类的css动画。

如何在jcarousel中使用回调在幻灯片中放置文本动画？

1 个答案: