Jquery 猫头鹰转盘导航不工作

我有两个转盘，一个在另一个下面，我正在使用“navContainer”功能来更改导航箭头的位置（我将它们放置在滑块上方）

当我有一个滑块时，这是可行的，但当我有2个（或更多）滑块时，两个滑块的导航都位于第一个“navhere”div中。相反，每个导航按钮都应该位于自己的div中

你可以更好地理解我在这里所说的：

代码是：

<div class="about">
    <div id="navhere"></div> <!-- This is where nav should appear -->
    <div class="owl-carousel">
        <div class="item"><h4>About</h4></div>
        <div class="item"><h4>Us</h4></div>
    </div>
</div>
<div class="contact">
    <div id="navhere"></div> <!-- This is where nav should appear -->
    <div class="owl-carousel">
        <div class="item"><h4>Contact</h4></div>
        <div class="item"><h4>Form</h4></div>
    </div>
</div>

---

不能复制

id

的值。它必须是独一无二的。这就是原因

还是。据了解，多导航尚未实施

导航不工作

.owlCarousel({
        startPosition: 0,
        margin: 20,
        dots: true,
        loop: true,
        autoplay: true,
        nav: true,
        pagination :true,
        autoplayTimeout:6000,
        responsiveClass:true,
        responsive:{
            0:{

                items:1
            },
            480:{

                items:2
            },
            568:{

                items:2
            },
            667:{

                items:2
            },
            768:{

                items:3
            },
            1024:{
                items:5
            }
        }
    });
});

---

在这里工作非常好：。是的，它显示两个，因为有两个滑块。每个滑块都有自己的导航。确实如此，它们会滑动，但两个滑块的导航都存储在第一个“导航”分区中。它们应该分别位于各自的分区中。也就是说，第二个分区“导航”为空，这就是第二个幻灯片的导航应该显示的位置。请通过css将导航容器从脚本位置移除并管理它们，我不知道现在该怎么办，但无论如何，非常感谢你的帮助！如果我不是很无聊（我想我很坚强…），你能看看这个吗？如果你有任何意见，这将意味着很多…我想我找到了一个解决办法：）但再次感谢大家的帮助！非常感谢！我找到了分页的解决方案：appendDots:$（this）.sibbines（'.pagination'），但只有当.pagination与滑块相匹配时，才会出现这种情况。如果是上一级呢？哈哈。。。可以因此，将其添加为兄弟姐妹。

.owlCarousel({
        startPosition: 0,
        margin: 20,
        dots: true,
        loop: true,
        autoplay: true,
        nav: true,
        pagination :true,
        autoplayTimeout:6000,
        responsiveClass:true,
        responsive:{
            0:{

                items:1
            },
            480:{

                items:2
            },
            568:{

                items:2
            },
            667:{

                items:2
            },
            768:{

                items:3
            },
            1024:{
                items:5
            }
        }
    });
});