我正在尝试将 glidejs 添加到 wordpress 网站,它在桌面上运行良好,但在移动设备上,它没有加载,似乎 JS 文件没有被执行。我在控制台中没有看到任何错误。这是密码笔。在手机上,我看到 3 张图片相互重叠。
模板
<section id="Glide" class="glide banner_desktop">
<!-- ARROWS -->
<div class="glide__arrows">
<button class="glide__arrow prev" data-glide-dir="<"><i class="fa fa-chevron-left fa-2x" aria-hidden="true"></i>
</button>
<button class="glide__arrow next" data-glide-dir=">"><i class="fa fa-chevron-right fa-2x" aria-hidden="true"></i>
</button>
</div>
<div class="glide__wrapper">
<ul class="glide__track">
<?php if ( have_rows( 'banner_desktop', 'option' ) ) : ?>
<?php while ( have_rows( 'banner_desktop', 'option' ) ) : the_row(); ?>
<?php if ( get_sub_field( 'image' ) ) { ?>
<li class="glide__slide">
<a href="<?php the_sub_field( 'link' ); ?>">
<img src="<?php the_sub_field( 'image' );?>" />
</a>
</li>
<?php
}
endwhile; endif;
?>
</ul>
</div>
<!-- CAROUSEL DOTS -->
<div class="glide__bullets"></div>
</section>
函数.php
wp_enqueue_script( 'glide', get_bloginfo( 'stylesheet_directory' ) . '/js/glide/glide.js', array('jQuery') );
wp_enqueue_script( 'glide_Js', get_bloginfo( 'stylesheet_directory' ) . '/js/glide/glide_JS.js', array('jQuery') );
wp_enqueue_style( 'glide_css', get_bloginfo( 'stylesheet_directory' ) . '/js/glide/glide.css');
wp_enqueue_style( 'glide_theme', get_bloginfo( 'stylesheet_directory' ) . '/js/glide/glide_theme.css');
glide.js 是
var glide = function () {
// glide.min.js code which is on codepen
// https://cdn.jsdelivr.net/npm/glidejs@2/dist/glide.min.js
}();