猫头鹰轮播滑动动画

编程问答 2022-08-16

问题描述

我正在尝试将动画添加到轮播中，但无法正常工作。无法弄清楚我哪里出了错。 这是我的Django项目中的模板。

html页面：

头部标签：

<head>
  
    <!-- CSS Files -->
    <link rel="stylesheet" href="{% static "Root_page/css/animate.css" %}">


    <!-- Owl Carousel -->
    <link rel="stylesheet" href="{% static "Root_page/css/owl.carousel.css" %}">
    <link rel="stylesheet" href="{% static "Root_page/css/owl.theme.css" %}">
    <title>...</title>
</head>

轮播部门：

<div class="custom1">
                            <div class="item">
                            <div class="container-fluid text-center">
                            <div class="card">
                                 ...
                            </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="container-fluid text-center">
                            <div class="card">
                                ...
                            </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="container-fluid">
                            <div class="card">
                                .....
                            </div>
                            </div>
                        </div>
                          </div>

JS部分：

<script src="{% static "user_interaction/assets/js/core/jquery.3.2.1.min.js" %}"></script>
<script src="{% static "Root_page/js/owl.carousel.js" %}"></script> 
<script>

var owl = $('.custom1').owlCarousel({
    animateOut: 'fadeOut',items:1,margin:30,stagePadding:30,smartSpeed:450,loop: true,});

</script>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

css-animationsjavascriptowl-carousel