提问者:小点点

Bootsrap导航栏在移动视图中快速切换


我的引导导航栏在移动视图中切换得太快了。 我想让它切换,即显示和隐藏链接点击汉堡切换按钮。 最初,我认为这是由于保证金的身体或我的div,但我的问题仍然存在。 我不知道是什么引起了这个问题。 有没有一种方法可以使用引导程序来实现这一点。 是某些样式(边距等)导致了这个问题,还是必须使用自定义javascript函数来使用按钮单击事件切换链接? 谢谢。


共1个答案

匿名用户

您使用的bootstrap CSS版本是Ver4.3.1,而您使用的bootstrap JS版本是Ver3.3.7。 将JS更新到兼容版本,它将按预期工作。 您应该将CSS脚本路径放在JS脚本路径之前。

<!--   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> </script> -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

仅供参考,bootstrap的最新版本是4.5.0。 您可以更新到以下版本。

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>