老师，请问效果为什么没出来
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
* { margin: 0; padding: 0; border: none; }
html,
body { overflow: hidden; height: 100%; background: #93b3c6; }
span { display: block; width: 16px; height: 16px; margin: 30px auto 40px; border-radius: 50%; background: #fff; }
nav { position: relative; display: flex; width: 78.125vw; margin: 0 auto 45px; justify-content: space-between; }
nav:before { position: absolute; top: 20px; display: block; width: 100%; height: 10px; content: ""; background: #fff; }
nav > a { font-size: 20px; position: relative; padding: 10px; text-decoration: none; color: #255d7e; border: 2px solid #5395b4; background: #fff; }
div { position: relative; overflow: hidden; width: 78.125vw; height: 75vh; margin: 0 auto; background: #fff; box-shadow: 0 0 30px 0 rgba(8, 1, 3, .3); }
div > img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 98%; height: 96%; margin: auto; }
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
var index=0;
var swiper=function (index){
$("img").eq(index).css({"opacity":"1"}).siblings().css({"opacity":"0"});
};
$("a").mouseenter=function (){
index=$(this).index();
swiper();
};
$("document").keydown=function (event){
if(event.keyCode==37){
if(index==0){
index=$("a").length-1;
}else{
index++;
}
swiper();
}else if(event.keyCode==39){
if(index==$("a").length-1){
index=0;
}else{
index--;
}
swiper();
}
};
</script>
</head>
<body>
<nav>
<a href="#">泸沽湖</a>
<a href="#">丽江古城</a>
<a href="#">茶马古道</a>
<a href="#">就这家·云逸客栈</a>
<a href="#">西双版纳</a>
<a href="#">云南红酒庄</a>
<a href="#">轿子雪山</a>
<a href="#">普者黑</a>
<a href="#">海埂大坝</a>
<a href="#">玉龙湾</a>
<a href="#">昆明郊野公园</a>
<a href="#">欧洲风琴小镇</a>
</nav>
<div>
<img src="images/1.jpg">
<img src="images/2.jpg">
<img src="images/3.jpg">
<img src="images/4.jpg">
<img src="images/5.jpg">
<img src="images/6.jpg">
<img src="images/7.jpg">
<img src="images/8.jpg">
<img src="images/9.jpg">
<img src="images/10.jpg">
<img src="images/11.jpg">
<img src="images/12.jpg">
</div>
</body>
</html>
正在回答
同学你好，这边修改之后按键盘是有反应的，同学是不是哪里改错了，可以检查下，尤其要检查下方写的对不对：
另外：关于同学的疑问，解答如下：
是可以循环的。另外：同学的代码有些问题，可以参考下方修改（思路在js轮播图部分就有讲过）：
如果还有其他疑问，建议在问答区重新提问，便于后期查找总结
如果我的回答帮到了你，欢迎采纳，祝学习愉快~
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星