Javascript 在slick js中的滑块上添加文本动画

我用滑头用横幅滑块。 我试图在滑块上的滑动文本上制作一些动画。 谁能帮我提供像fadeInRight/fadeInleft等动画

CSS代码

  <style type="text/css">
    html, body {
      margin: 0;
      padding: 0;
    }

    * {
      box-sizing: border-box;
    }

    .slider {
        width: 100%;
        /*margin: 100px auto;*/ 
    }

    .slick-slide {
      position: relative;
    }

    .slick-slide img {
      width: 100%;
      height: auto;
    }

    .slick-prev:before,
    .slick-next:before {
        color: black;
    }

    .slick-next {
    right: 30px;
    z-index: 99999;
    }

    .slick-prev {
    left: 30px;
    z-index: 9999;
    }

    .slick-dots
    {
        bottom: 25px;
    }


    .banner-content-right
    {
        position: absolute;
        left:55%;
        top: 244px;
    }




  </style>

html，正文{
保证金：0；
填充：0；
}
* {
框大小：边框框；
}
.滑块{
宽度：100%；
/*保证金：100px自动；*/
}
.滑滑梯{
位置：相对位置；
}
.滑溜式img{
宽度：100%；
高度：自动；
}
.史莱克·普雷夫：之前，
.滑头下一个：之前{
颜色：黑色；
}
.下一个{
右：30px；
z指数：99999；
}
.滑头{
左：30px；
z指数：9999；
}
.圆点
{
底部：25px；
}
.横幅内容权
{
位置：绝对位置；
左：55%；
顶部：244px；
}

HTML代码

  <section class="regular slider">
    <div>
      <img src="img/ghi.jpg">
        <div class="banner-content-right">
            <div class="banner-11 bannerFadeInRightBig">AAA</div>
            <div class="banner-12 bannerFadeInRightBig">ABC</div>
            <div class="banner-13 bannerFadeInRightBig">DEF</div>
            <div class="banner-14 bannerFadeInRightBig">GHI</div>
        </div>
    </div>
    <div>
      <img src="img/abc.jpg">
    </div>
    <div>
      <img src="img/def.jpg">
    </div>
  </section>

  <script src="https://code.jquery.com/jquery-2.2.0.min.js" type="text/javascript"></script>
  <script src="./slick/slick.js" type="text/javascript" charset="utf-8"></script>

AAA
基础知识
DEF
GHI

JS代码

    $(document).on('ready', function() {

      $(".regular").slick({
        dots: true,
        //autoplay: true
      });

    });
  </script>

$（document）.on（'ready'，function（）{
美元（“.regular”）。光滑({
点：是的，
//自动播放：对
});
});