代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="css/body.css">
<link rel="stylesheet" href="css/home.css">
<link rel="stylesheet" href="./css/foot.css">
<link rel="stylesheet" href="./iconfont/iconfont.css">
<script src="./js/jquery-3.5.1.js"></script>
</head>
<body>
<div id="header">
<div class="top conter">
<ul class="top_left">
<li><a href="#">小米商城</a></li>
<li><a href="#">MIUI</a></li>
<li><a href="#">IOT</a></li>
<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>
<li><a href="#">资质证照</a></li>
<li><a href="#">协议规则</a></li>
<li><a href="#">下载app</a></li>
<li><a href="#">智能生活</a></li>
<li><a href="#" style="border: none;"> Select Location</a></li>
</ul>
<ul class="top_right">
<li><a href="#">注册</a></li>
<li><a href="#">登录</a></li>
<li><a href="#" style="border: none;">消息通知</a></li>
<div class="gwc">
<a href="javascript:;">
购物车<span>(0)</span>
</a>
<div class="gwcmessage">
购物车没商品，快去选购吧！
</div>
</div>
<script>
$('.gwc').hover(function() {
$('.gwcmessage').stop().slideDown(500)
}, function() {
$('.gwcmessage').stop().slideUp(500)
})
</script>
</ul>
</div>
</div>
<!-- 顶部 -->
<div id="nav">
<div class="conter">
<h1>
<a href="#">小米商城</a>
</h1>
<div class="scer">
<form action="">
<input type="text" name="" id="">
<input type="button" value="搜索">
</form>
</div>
<div class="nav">
<ul>
<li class="active"><a href="#">所有商品分类</a>
</li>
<li class="active"><a href="#">小米手机</a>
</li>
<li><a href="#">Redmi红米</a>
</li>
<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>
<li><a href="#">服务</a></li>
<li><a href="#">社区</a></li>
<ol class="menu">
<li class="active">
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
<li>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
<li>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
<li>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
<li>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
<li>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
<li>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
<a href="#"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110" alt="">
<p>小米 11</p>
<span>3999起</span>
</a>
</li>
</ol>
</ul>
</div>
</div>
</div>
<script>
// $('.nav ul li:eq(7)').prevAll().mouseenter(function() {
// $('.menu').stop().slideDown(300)
// })
// $('.nav').mouseleave(function() {
// $('.menu').stop().slideUp(300)
// })
// console.log($('.nav ul li:gt(0):lt(7)'));
$('.nav ul li').mouseenter(function() {
if ($(this).index() > 0 && $(this).index() < 8) {
$('.menu').stop().slideDown(300)
}
})
$('.nav').mouseleave(function() {
$('.menu').stop().slideUp(300)
})
// $('.nav ul li:eq(6)').next().mouseenter(function() {
// $('.menu').stop().slideUp(300)
// })
$('.nav ul li').hover(function() {
$(this)
.addClass('active')
.siblings()
.removeClass('active')
.parent()
.next()
.children()
.eq($(this).index())
.addClass('active')
.siblings()
.removeClass('active')
})
</script>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。