Я пытаюсь сделать слайдер с owljs. Это не первый раз, когда я использую плагин, но я, кажется, застрял где-то. Почему, когда я добавляю класс «сова-карусель» на свой слайдер, все элементы исчезают?
Ниже приводится мой HTML:
<div class="slider-wrapper">
<div id="topslider" class="owl-carousel owl-theme">
<div class="slide1">1</div>
<div class="slide2">2</div>
<div class="slide3">3</div>
<div class="slide4">4</div>
<div class="slide5">5</div>
</div>
</div>
мой сценарий:
$(document).ready(function(){
// Activate Owl Carousel
$('#topslider').owlCarousel({
loop:true,
nav:true,
});
Мой файл wordpress function.php:
add_action('wp_enqueue_scripts', 'load_parent_styles');
function load_parent_styles() {
wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
}
function load_theme_assets() {
// Load Font Awesome Stylesheet
wp_enqueue_style( 'load-fa', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' );
// Load AnimateCss
wp_enqueue_style('animate', get_stylesheet_directory_uri() . '/assets/css/animate.css');
// Load Owl Carousel Stylesheet
wp_enqueue_style('owl-carousel-min', get_stylesheet_directory_uri() . '/assets/css/owl.carousel.min.css');
// Load Owl Theme Default
wp_enqueue_style('owl-theme-default-min', get_stylesheet_directory_uri() . '/assets/css/owl.theme.default.min.css');
// Load Jquery
wp_enqueue_script('jquery', get_stylesheet_directory_uri() . '/assets/js/jquery-min.js');
// Load Owl Carousel
wp_enqueue_script('owl-carousel', get_stylesheet_directory_uri() . '/assets/js/owl.carousel.min.js');
// Load Custom Script
wp_enqueue_script('mainscript', get_stylesheet_directory_uri() . '/assets/js/mainscript.js');
// Load Google Fonts
wp_enqueue_style('wpb-google-fonts', 'https://fonts.googleapis.com/css?family=Cardo|EB+Garamond|Nanum+Gothic|Raleway|Slabo+27px|Source+Serif+Pro|Ubuntu|Vollkorn&display=swap', false );
}
add_action('wp_enqueue_scripts', 'load_theme_assets');