<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>当当网我的订单页</title>
<script type="text/javascript" src="../../jquery/jquery-3.3.1.js"></script>
<link type="text/css" rel="stylesheet" href="css/dangdang.css">
<script type="text/javascript" src="index.js"></script>
</head>
<body>
<div id="menu" class="pos">
<a href="#">我的当当</a>
<ul id="menu-ul">
<li><a href="#">我的订单</a></li>
<li><a href="#">我的收藏</a></li>
<li><a href="#">我的礼品卡</a></li>
<li><a href="#">我的积分</a></li>
<li><a href="#">我的余额</a></li>
</ul>
</div>
</body>
</html>
*{
margin:0px;
padding:0px;
font-size:12px;
}
a{
color:#999;
text-decoration:none;
}
body{
background:#fff url(../images/bg.jpg) no-repeat;
}
ul{
list-style:none;
}
.pos{
position:absolute;
}
#menu{
left:590px;
top:5px;
}
#menu li{
display:block;
height:20px;
line-height:20px;
background-color:#fff;
padding:4px;
}
// JavaScript Document
$(document).ready(function(){
$("#menu").mouseover(function(){
$("#menu-ul").css({
"border":"solid 1px #EE7304",
"display":"block"}
);
});
$("#menu").mouseout(function(){
$("#menu-ul").css(
{"display":"none"}
);
});
});
网友评论