微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Swiper js 在 wordpress 中不起作用,javascript 文件不起作用

如何解决Swiper js 在 wordpress 中不起作用,javascript 文件不起作用

js 文件不起作用,尽管它包含在标题中。我不明白如何正确设置。 https://i.stack.imgur.com/ZI8lj.png

<div id="swiper-container">
                <div class="swiper-wrapper">
                    <?PHP
                        $main = get_field('main',7);
                        $rows = $main['slider-main'];
                        if( $rows ) {
                                foreach( $rows as $row ) {
                            echo '<div class="swiper-slide">';
                            echo '<li style="background-image: url(' .$row['slider-main-img']. ')">';
                            echo '<h3 class="slider-main-h3">' .$row['slider-main-text-h3']. '</h3>';
                            echo '<h2 class="slider-main-h2">' .$row['slider-main-text-h2']. '</h2>';
                            echo '<a href="' .$row['slider-main-href']. '" class="btn-more"> ' .$row['slider-main-text-button']. ' </a>';
                                echo '<style type="text/css"> 
                                    .btn-more { color: ' .$row['slider-main-button-collor']. ';}
                                    .slider-main-h3 { color: ' .$row['slider-main-text-h3-collor']. ';}
                                    .slider-main-h2 { color: ' .$row['slider-main-text-h2-collor']. ';}
                                </style>';
                            echo '</li>';
                            echo '</div>';
                            }
                        }
                    ?>      
                </div>
                <div class="swiper-pagination"></div>
                    <!-- Add Arrows -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>  
            </div>

函数 mythem_enqueue_style() { wp_deregister_script('jquery'); wp_register_script(' jquery ',get_template_directory_uri() .'/js/jquery-3.6.0.min.js',false,null,true); wp_enqueue_script('jquery');

wp_enqueue_script( 'swiper-script',get_template_directory_uri() . '/js/swiper-bundle.min.js',array(),true);
wp_enqueue_script( 'swiper-script-setings',get_template_directory_uri() . '/js/swiper-main.js',array('swiper-script'),true);

wp_enqueue_style( 'swiper-style',get_template_directory_uri(). '/css/swiper-bundle.min.css');
wp_enqueue_style( 'style-theme',get_template_directory_uri(). '/css/style.css');
}
add_action( 'wp_enqueue_scripts','mythem_enqueue_style' );


.swiper-container {
    width: 100% !important;
    height: 100% !important;

  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-Box;
    display: -ms-flexBox;
    display: -webkit-flex;
    display: flex;
    -webkit-Box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-Box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。