老师我这个小测试没反应，帮我看一下
模拟手机端导航滑下来的一个小测试，鼠标点圈圈，导航还是不会掉下来没反应，我是哪里代码有问题？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/js.js"></script>
<script type="text/javascript" src="js/jq.js"></script>
<link rel="stylesheet" type="text/css" href="css/css.css">
</head>
<body>
<div id='o'></div>
<div class="nav">
<ul class="na">
<li><a href="#">前端</a></li>
<li><a href="#">java</a></li>
<li><a href="#">ios</a></li>
<li><a href="#">Android</a></li>
<li><a href="#">php</a></li>
</ul>
</div>
</body>
</html>
-----------------------------------------------------------
css代码
#o{
width: 50px;
height: 50px;
border-radius: 50px;
border: 1px solid green;
position: absolute;
left: 30px;
top: 30px;
z-index: 4;
}
.nav{
height: 0px;
}
.nav>.na{
list-style: none;
display: flex;
flex-direction: column;
text-align: center;
color: #ffffff;
background:skyblue;
width: 100%;
position: absolute;
top: -130px;
transition: all 1s;
z-index: 1;
}
.nav>.na.active{
top: 80px;
transition: all 1s;
}
-------------------------------------------------
JS代码
$(function(){
var p=false;
$("#o").click(function(){
if(p==false){
$('.na').addClass('active');
p=true;
}else{
$('.na').removeClass('active');
p=false;
}
})
})
正在回答
同学你好，是代码中引入的jq链接和自己写的js文件顺序反了：
在js文件中用了jq中的语法，所以需要先引入jq文件，再引入自己写的js文件。
可以重新测试下，祝学习愉快！
- 参与学习 人
- 提交作业 2198 份
- 解答问题 5012 个
如果你有web端基础，既想进阶，又想进军移动端开发，那就来吧，我们专题为你带来的课程有HTML5、CSS3、移动基础、响应式、bootstrap、less等，让你在前端道路上畅通无阻！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星