Javascript 如何通过jQuery触发kingcomposer css动画？

目前，我正在开发一个wordpress自定义主题，我们使用kingcomposer builder制作内容

每个帖子都是一个幻灯片，每个组曲部分都是一个幻灯片。当文章被加载并且在第一张幻灯片上kingcomposer css动画工作时，但当我转到下一张幻灯片时，动画没有激活

这是由kingcomposer builder生成的HTML：

<div id="livingmemorial" class="lm-story-section fullpage-wrapper" style="height: 100%; position: relative; touch-action: none; transform: translate3d(0px, 0px, 0px);">
<section data-kc-fullheight="middle-content" class="kc-elm kc-css-17041 section kc_row fp-section active fp-table fp-completely" data-fp-styles="null" style="height: 657px;">
    <div class="fp-tableCell" style="height: 657px;">
        <div class="kc-row-container  kc-container  intro">
            <div class="kc-wrap-columns">
                <div class="kc-elm kc-css-139517 kc_col-sm-12 kc_column kc_col-sm-12">
                    <div class="kc-col-container">
                        <div class="kc-elm kc-css-605939 kc_text_block kc-pc-loaded">
                            <h1 style="color: #fff;font-size:72px">Lorem ipsum</h1>
                        </div>
                        <div class="kc-elm kc-css-834586 kc_text_block kc-pc-loaded" style="">
                            <h3 style="color: #fff;font-size:32px;"><em>Dolore sit amet</em></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section data-kc-fullheight="middle-content" class="kc-elm kc-css-521807 section kc_row fp-section fp-table" data-fp-styles="null" style="height: 657px;">
    <div class="fp-tableCell" style="height: 657px;">
        <div class="kc-row-container  kc-container  intro">
            <div class="kc-wrap-columns">
                <div class="kc-elm kc-css-705768 kc_col-sm-5 kc_column kc_col-sm-5">
                    <div class="kc-col-container">
                        <div class="kc-elm kc-css-655426 kc-animated kc-animate-eff-fadeInUp kc_text_block">
                            <h3 style="text-align: left; color: #fff; font-size: 32px;">Chapter 1</h3>
                        </div>
                        <div class="kc-elm kc-css-28636 kc-animated kc-animate-eff-fadeInUp kc-animate-delay-200 kc_text_block">
                            <h1 style="text-align: left; color: #fff; font-size: 72px;">Lorem ipsum</h1>
                        </div>
                        <div class="kc-elm kc-css-600603 kc-animated kc-animate-eff-fadeInUp kc-animate-delay-400 kc_text_block">
                            <p style="text-align: left; color: #fff; font-size: 21px; line-height: 1.3em;">Lorem ipsum dolore sit amet.</p>                                
                        </div>
                    </div>
                </div>
                <div class="kc-elm kc-css-408249 kc_col-sm-7 kc_column kc_col-sm-7">
                    <div class="kc-col-container"></div>
                </div>
            </div>
        </div>
    </div>
</section>

乱数假文
多洛雷·西特·阿梅特
第一章
乱数假文
Lorem ipsum dolore sit amet.

这是滑块的JS代码：

<script type="text/javascript">
    var myFullpage = new fullpage('#livingmemorial', {
        scrollOverflow: true
    });
</script>

var myFullpage=new fullpage（“#livingmemorial”{
scrollOverflow：真
});

下面是kingcomposer JS：

这是我的名字：

---

最后，我的问题是，有人能解释一下，当转到下一张幻灯片时，如何再次触发kingcomposer动画。

我找到了解决此问题的方法

<script type="text/javascript">
    var myFullpage = new fullpage('#livingmemorial', {
        scrollOverflow: true,
        afterLoad: function (origin, destination, direction) {
            jQuery('section.active .kc-animated').each(function (index) {
                var clazz = jQuery(this).get(0).className, delay = 0, speed = '2s', timeout = 0;

                if (clazz.indexOf('kc-animate-delay-') > -1) {
                    delay = clazz.split('kc-animate-delay-')[1].split(' ')[0];

                    jQuery(this).css({'animation-delay': delay + 'ms'});
                    jQuery(this).removeClass('kc-animate-delay-' + delay);

                    timeout += parseInt(delay);
                }

                if (clazz.indexOf('kc-animate-speed-') > -1) {
                    speed = clazz.split('kc-animate-speed-')[1].split(' ')[0];

                    jQuery(this).css({'animation-duration': speed});
                    jQuery(this).removeClass('kc-animate-speed-' + speed);
                }

                if (clazz.indexOf('kc-animate-eff-') > -1) {
                    var eff = clazz.split('kc-animate-eff-')[1].split(' ')[0];

                    timeout += parseFloat(speed) * 1000;

                    jQuery(this).removeClass('kc-animated').addClass('animated ' + eff);

                    setTimeout(function (eff) {
                        jQuery(this).removeClass('animated kc-animated kc-animate-eff-' + eff + ' ' + eff);
                        jQuery(this).css({'animation-delay': '', 'animation-duration': ''});
                    }, timeout, jQuery(this), eff);
                }
            });
        }
    });
</script>

var myFullpage=new fullpage（“#livingmemorial”{
对,，
后装：功能（起点、终点、方向）{
jQuery（'section.active.kc animated'）。每个（函数（索引）{
var clazz=jQuery（this）.get（0）.className，延迟=0，速度=2s，超时=0；
if（clazz.indexOf（'kc-animate-delay-'）>-1）{
delay=clazz.split（'kc-animate-delay-'）[1]。split（''）[0]；
jQuery（this）.css（{'animation-delay'：delay+'ms'}）；
jQuery（this）.removeClass（'kc-animate-delay-'+delay）；
超时+=parseInt（延迟）；
}
if（clazz.indexOf（'kc-animate-speed-'）>-1）{
speed=clazz.split（'kc-animate-speed-'）[1]。split（''）[0]；
jQuery（this）.css（{'animation-duration'：speed}）；
jQuery（this）.removeClass（'kc-animate-speed-'+speed）；
}
if（clazz.indexOf（'kc-animate-eff-'）>-1）{
var eff=clazz.split（'kc-animate-eff-'）[1]。split（''）[0]；
超时+=parseFloat（速度）*1000；
jQuery（this）.removeClass（'kc-animated'）.addClass（'animated'+eff）；
设置超时（功能（eff）{
jQuery（this）.removeClass（'animated kc animated kc animate eff-'+eff+'+eff）；
jQuery（this）.css（{'animation-delay'：''，'animation duration'：''}）；
}，超时，jQuery（this），eff）；
}
});
}
});