老师我顶部的下拉菜单 单鼠标移上去会往右移动一下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery大作业</title>
<link rel="stylesheet" type="text/css" href="css/jquery.css">
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<div class="top">
<div class="main">
<div class="left">
<a href="#" class="login">亲，请登录 </a>
<a href="#" class="register">免费注册 </a>
<a href="#" class="shopping">手机逛慕课</a>
</div>
<div class="right">
<ul class="list">
<li>
<div>我的慕淘 <img src="img/icon/22.png" /></div>
<ul>
<li>已买到的宝贝</li>
<li>我的足迹</li>
</ul>
</li>
<li>
<div>收藏夹 <img src="img/icon/22.png" /></div>
<ul>
<li>收藏的宝贝</li>
<li>收藏的店铺</li>
</ul>
</li>
<li>
<div>商品分类</div>
</li>
<li>
<div>卖家中心 <img src="img/icon/22.png" /></div>
<ul>
<li>免费开店</li>
<li>已卖出的宝贝</li>
<li>出售中的宝贝</li>
<li>卖家服务市场</li>
<li>卖家培训中心</li>
<li>体验中心</li>
</ul>
</li>
<li>
<div>联系客服 <img src="img/icon/22.png" /></div>
<ul>
<li>消费者客服</li>
<li>卖家客服</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div class="logo">
<img src="img/logo.png" />
</div>
<div class="nav"></div>
<div class="banner"></div>
<div class="rightBanner"></div>
<div class="floor"></div>
<div class="link"></div>
<div class="footer"></div>
<body>
</body>
</html>
*{padding:0px;margin:0px;text-decoration:none;list-style:none;}
.top{width:100%;height:41px;background:#f3f5f7;font-size:14px;z-index:1;}
.top .main{width:1000px;margin:0 auto;height:40px;line-height:40px;border-bottom:1px solid gray;}
.top .main .left{width:550px;height:40px;float:left;}
.top .main .left .login{color:red;}
.top .main .left .register:hover,.shopping:hover{color:red;}
.top .main .right{width:446px;height:40px;float:left;}
.top .main .right .list>li{display:inline-block;float:left;padding-right:15px;}
.top .main .right .list ul{display:none;background:white;border:1px solid gray;}
.top .main .right .list ul li{line-height:30px;}
.logo{width:100%;height:130px;background:#f3f5f7;z-index:-1;}
.logo img{padding-left:185px;padding-top:35px;}
$(document).ready(function(){
$('.right div').mouseenter(function(){
$(this).nextAll().css('display','inline-block').parent().siblings().find('ul').css('display','none');
})
$('.right div').mouseleave(function(){
$(this).nextAll().css('display','none');
})
})
还有要怎么让它整个都有边框，我的只有下面弹出来的有边框，要怎么设置
正在回答
同学，你好。鼠标悬浮会往右移一下，是因为下拉菜单中的导航项的内容自适应的宽度超过了顶部导航的宽度，可以增大顶部导航的宽度，就不会有这个问题了。如图：
整个都有边框，需要鼠标经过时给顶部导航区域设置边框，如图：
祝学习愉快！
相似问题
登录后可查看更多问答，登录/注册
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星