如何修复WordPress的slider.js?

时间:2019-03-25 15:54:00

标签: php wordpress advanced-custom-fields slick.js

我正在尝试使用ACF中继器创建一个Slick JS,但是它不起作用。

以下代码仅显示一个接一个的图像。

有什么我忘记的东西吗?

顺便说一下,我已经在functions.php上注册了CSS和JavaSscript。

<section>
    <div id="slick-hero">

        <a id="slick-hero-left" class="slick-hero__arrow-container slick-hero__arrow-container--prev">
          <div class="slick-hero__icon-container">
            <div class="slick-hero__icon">
              <i class="fas fa-angle-left"></i>
            </div>
          </div>
        </a>

        <a id="slick-hero-right" class="slick-hero__arrow-container slick-hero__arrow-container--next">
          <div class="slick-hero__icon-container">
            <div class="slick-hero__icon">
              <i class="fas fa-angle-right"></i>
            </div>
          </div>
        </a>

      <div class="slick-hero__slider">
        <?php if ( have_rows( 'slider_2019_home' ) ) : ?>
        <?php while ( have_rows( 'slider_2019_home' ) ) : the_row(); ?>
        <div class="slick-hero__slide" style="background-image:url(<?php the_sub_field('slider_home_2019_image'); ?>)">
          <div class="container slick-hero__slide__container">
          <div class="row">
            <div class="col-12">
              <div class="slick-hero__slide__content">
                <a class="slick-hero__slide__link" href="<?php the_sub_field('slider_home_2019_link'); ?>">
                  <h4 class="slick-hero__slide__heading">
                    <?php the_sub_field('slider_home_2019_heading'); ?>
                  </h4>
                  <h2 class="slick-hero__slide__title">
                    <?php the_sub_field('slider_home_2019_sub_title'); ?>
                  </h2>
                  <hr class="hero-slider__divider">
                  <p class="slick-hero__slide__body">
                    <?php the_sub_field('slider_home_2019_body'); ?>
                  </p>
                  <p class="slick-hero__slide__cta-text">
                    <?php the_sub_field('slider_home_2019_cta_text'); ?>
                  </p>
                </a>
              </div>
            </div>
          </div>
          </div>
        </div>
      <?php endwhile; ?>
      <?php wp_reset_postdata(); ?>
      <?php else : ?>
      <?php endif; ?>
      </div> <?php // end slick-hero__slider ?>
    </div> <?php // end slick-hero ?>
</section>

1 个答案:

答案 0 :(得分:0)

你在跑步

$(document).ready(function(){
    $(".slick-hero__slider").slickjs()
})

任何地方?