汉堡导航不可点击 - 已检查脚本和 CDN
Posted
技术标签:
【中文标题】汉堡导航不可点击 - 已检查脚本和 CDN【英文标题】:Hamburger nav not clickable - already checked scripts and CDN 【发布时间】:2019-10-20 09:30:30 【问题描述】:我整晚都在和这个作斗争。我试图为我的网站的移动版本实现一个简单的汉堡菜单。不知何故,它不可点击!它只是不会扩大。
没有控制台日志错误,我尝试了以下方法:
移动了我所有的脚本文件 - jquery、bootstrap和js的顺序 - 将它们放在头部而不是页脚
已检查 CDN - 我的意思是,我确实有一个系统范围的 addblocker。但是我已经将代码放到了 qtopia.hallometmaxz.nl 中,但它也不能在我的手机或平板电脑上运行
更改了类的 ID,甚至尝试在 css 中放入 z-index 9999!
<head>
<link href="assets/fonts/font-awesome.css" rel="stylesheet" type="text/css">
<link href="assets/fonts/elegant-fonts.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.css" type="text/css">
<link rel="stylesheet" href="assets/css/magnific-popup.css" type="text/css">
<link rel="stylesheet" href="assets/css/style.css" type="text/css">
<script src="assets/js/jquery-2.2.1.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div class="page-wrapper">
<header>
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="navigation animate">
<li><a href="" data-toggle="modal" data-target="#modal-over-ons">Over Ons</a></li>
<li><a href="" data-toggle="modal" data-target="#modal-gallery">Foto's</a></li>
<li><a href="https://www.qtopiaqueerartsfestival.nl/vacatures/" target="_blank">Vacatures</a></li>
<li><a href="https://www.qtopiaqueerartsfestival.nl/" target="_blank">editie 2018</a></li>
<li><a href="" data-toggle="modal" data-target="#modal-contact">Contact</a></li>
</ul></div>
<!--end navigation-->
</div>
</nav>
</header>
&&&
<script src="assets/js/jquery.validate.min.js"></script>
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.1/TweenLite.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.1/easing/EasePack.min.js"></script>
<script src="assets/js/exploding-triangles.js"></script>
<script src="assets/js/custom.js"></script>
</body>
请帮忙!我需要这个东西启动并运行,但不知何故它不起作用
【问题讨论】:
我修好了!我的样式表有冲突... 【参考方案1】:如果您愿意,可以参考以下链接。它可能会帮助您制作汉堡图标..https://www.w3schools.com/howto/howto_js_mobile_navbar.asp
【讨论】:
以上是关于汉堡导航不可点击 - 已检查脚本和 CDN的主要内容,如果未能解决你的问题,请参考以下文章