代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
<link rel="icon" href="./images/favicon.ico">
<title>锤子商城 - 坚果手机、坚果 R2 手机、Smartisan TNT go 扩展本</title>
<link rel="stylesheet" href="./css/categoryr4.css">
<link rel="stylesheet" href="./css/iconfont.css">
<script src="./js/categoryr4.js"></script>
</head>
<body>
<div class="ctn">
<!-- 导航条 -->
<nav class="navbar-inverse">
<!-- 锤子logo -->
<div class="logo"><img src="./images/logo.png" alt=""></div>
<!-- 导航选项 -->
<div class="navbar-container">
<ul class="navbar-words">
<li><a href="shop.html">在线商城</a></li>
<li><a href="./r2.html">坚果R2</a></li>
<li><a href="./smartisan.html">Smartisan TNT go</a></li>
<li><a href="./gongzuozhan.html">坚果TNT工作站</a></li>
<li><a href="javascript:void(0);">Smartisan OS</a></li>
<li><a href="javascript:void(0);">欢喜云</a></li>
<li><a href="javascript:void(0);">论坛</a> </li>
<li><a href="javascript:void(0);">开发者支持</a></li>
<li><a href="javascript:void(0);">荣誉与奖项</a></li>
</ul>
</div>
<!-- 登录，购物车 -->
<div class="login"><a href="./login.html"></a></div>
<div class="shopcart">
<a href="./fuqian.html">
<div class="shopcart-empty">
<div>
<img src="./images/shopcart.png" alt="">
<p>购物车为空</p>
<p>您还没有选购任何商品，现在前往商城选购吧！</p>
</div>
</div>
</a>
</div>
</nav>
<!-- title,搜索框 -->
<div class="main-title">
<div class="title-container">
<ul class="title-item">
<li class="pull-down">
<a href="./shop.html">首页</a>
<!-- 下拉选项框 -->
<div>
<div id="pull-downcontainer">
<ul>
<li>手机</li>
<li><img src="./images/shouji01.webp" alt=""><span>手机</span></li>
</ul>
<ul>
<li>官方配件</li>
<li><img src="./images/shouji02.webp" alt=""><span>蓝牙耳机</span></li>
<li><img src="./images/shouji03.webp" alt=""><span>数据线</span></li>
<li><img src="./images/shouji04.webp" alt=""><span>充电器</span></li>
<li><img src="./images/shouji05.webp" alt=""><span>移动电源</span></li>
<li><img src="./images/shouji06.webp" alt=""><span>拍照配件</span></li>
</ul>
</div>
</div>
</li>
<li class="pull-down">
<a href="./categoryr2.html">坚果手机</a>
<!-- 下拉选项框 -->
<div></div>
</li>
<li class="pull-down">
<a href="./categoryr3.html">TNT</a>
<!-- 下拉选项框 -->
<div></div>
</li>
<li class="pull-down">
<a href="./categoryr4.html">官方自营</a>
<!-- 下拉选项框 -->
<div></div>
</li>
<li class="pull-down" id="last-one">
<a href="javascript:void(0);">服务</a>
<!-- 下拉选项框 -->
<div>
<ul class="pull-service">
<li><img src="./images/fuwu01.png" alt=""><span>保修服务</span></li>
<li><img src="./images/fuwu02.png" alt=""><span>在线客服</span></li>
<li><img src="./images/fuwu03.png" alt=""><span>服务政策</span></li>
<li><a href="./tijiaoshouhou.html"><img src="./images/fuwu04.png" alt=""></a><span>发起售后</span></li>
<li><img src="./images/fuwu05.png" alt=""><span>维修门店</span></li>
<li><img src="./images/fuwu06.png" alt=""><span>自助服务</span></li>
</ul>
</div>
</li>
</ul>
<!-- 搜索框 -->
<div class="search-input">
<div><img src="./images/magnifier.png" alt=""></div>
<input type="text">
<a href="./gouwuche.html" class="R2">坚果 R2</a>
<a href="./gouwuche2.html" class="TNT">TNT</a>
</div>
<div class='searchactive'>
<a href="./login.html"><img src="./images/login01.png"></a>
<a href="" class="a-active">
<img src="./images/shopcart01.png">
<div class="active-empty">
<div>
<img src="./images/shopcart.png" alt="">
<p>购物车为空</p>
<p>您还没有选购任何商品，现在前往商城选购吧！</p>
</div>
</div>
</a>
</div>
</div>
</div>
<div id="display">
<ul>
<li><a href="">坚果 R2</a></li>
<li><a href="">蓝牙耳机</a></li>
<li><a href="">TNT</a></li>
<li><a href="">移动电源</a></li>
<li><a href="">坚果快充</a></li>
<li><a href="">坚果 R2保护套</a></li>
</ul>
</div>
<!-- 热门商品 -->
<div class="hot-product">
<div class="hot-title">
<ul class="fenlei">
<li>综合排序</li>
<li><span>.</span>销量排序</li>
<li><span>.</span>价格低到高</li>
<li><span>.</span>价格高到低</li>
</ul>
<!-- <div><img src="./images/下载.png" alt=""></div>
<div><img src="./images/下载.png" alt="" class="right-arrow"></div> -->
</div>
<div class="pro-pic">
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot01.webp" alt=""></a></div>
<h3>坚果R2</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥2,699.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot02.webp" alt=""></a></div>
<h3>Smartisan TNT 大满足套装</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥4,999.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot03.webp" alt=""></a></div>
<h3>Smartisan 真无线蓝牙耳机（抖音文创限量款）</h3>
<h5>抖音文创限量版</h5>
<span>￥299.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
</div>
<div class="pro-pic">
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot01.webp" alt=""></a></div>
<h3>坚果R2</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥2,699.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot02.webp" alt=""></a></div>
<h3>Smartisan TNT 大满足套装</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥4,999.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot03.webp" alt=""></a></div>
<h3>Smartisan 真无线蓝牙耳机（抖音文创限量款）</h3>
<h5>抖音文创限量版</h5>
<span>￥299.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
</div>
<div class="pro-pic">
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot01.webp" alt=""></a></div>
<h3>坚果R2</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥2,699.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot02.webp" alt=""></a></div>
<h3>Smartisan TNT 大满足套装</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥4,999.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot03.webp" alt=""></a></div>
<h3>Smartisan 真无线蓝牙耳机（抖音文创限量款）</h3>
<h5>抖音文创限量版</h5>
<span>￥299.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
</div>
<div class="pro-pic">
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot01.webp" alt=""></a></div>
<h3>坚果R2</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥2,699.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot02.webp" alt=""></a></div>
<h3>Smartisan TNT 大满足套装</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥4,999.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot03.webp" alt=""></a></div>
<h3>Smartisan 真无线蓝牙耳机（抖音文创限量款）</h3>
<h5>抖音文创限量版</h5>
<span>￥299.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
</div>
<div class="pro-pic">
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot01.webp" alt=""></a></div>
<h3>坚果R2</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥2,699.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot02.webp" alt=""></a></div>
<h3>Smartisan TNT 大满足套装</h3>
<h5>是下一代手机，更是下一代电脑</h5>
<span>￥4,999.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot03.webp" alt=""></a></div>
<h3>Smartisan 真无线蓝牙耳机（抖音文创限量款）</h3>
<h5>抖音文创限量版</h5>
<span>￥299.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
<div>
<div><a href="./gouwuche.html" target="_blank"><img src="./images/hot04.webp" alt=""></a></div>
<h3>Smartisan 真无线TWS蓝牙耳机</h3>
<h5>智能配对 开盖即连</h5>
<span>￥99.00</span>
</div>
</div>
</div>
<div class="footer">
<div>
<div class="footer-menu">
<ul>
<li>
<h3>订单服务<h3>
<div>
<a href="">购买指南</a>
<a href="">送货政策</a>
</div>
</li>
<li>
<h3>服务支持<h3>
<div>
<a href="">自主服务</a>
<a href="">维修门店</a>
</div>
</li>
<li>
<h3>媒体中心<h3>
<div>
<a href="">新闻动态</a>
<a href="">官方视频</a>
<a href="">图片资源</a>
</div>
</li>
<li>
<h3>关注我们<h3>
<div>
<a href="">新浪微博</a>
<a href="">官方微信</a>
<a href="">荣誉奖项</a>
</div>
</li>
</ul>
<div class="footer-service">
<a href="#" class="iconfont icon-wenhaofill"></a>
<span>在线帮助</span>
</div>
</div>
<div class="footer-info">
<ul>
<li>Copyright © 2020 smartisan.com 版权所有</li>
<li><a href="">锤子商城隐私政策</a></li>
<li><a href="">锤子商城用户协议</a></li>
<li><a href="">资质证照</a></li>
</ul>
<ul>
<li><a href="">京 ICP 备 19048576 号 - 1</a></li>
<li><a href="">京公网安备 11010802033469号</a></li>
<li><a href="">京食药网食备 202010031</a></li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
<script>
//获取导航条
var guid = document.querySelectorAll(".pull-down");
for (let i = 0; i < guid.length; i++) {
guid[i].onmouseenter = function () {
this.querySelector("div").style.display = "block";
}
guid[i].onmouseleave = function () {
this.querySelector("div").style.display = "none";
}
}
//获取导航条搜索框
var navbar = document.querySelector(".search-input");
var searchactive = document.querySelector(".searchactive")
//获取滚动条位置
function getScrollTop() {
var scrollPos;
if (window.pageYOffset) {
scrollPos = window.pageYOffset;
}
else if (document.compatMode && document.compatMode != 'BackCompat') {
scrollPos = document.documentElement.scrollTop;
}
else if (document.body) {
scrollPos = document.body.scrollTop;
}
return scrollPos;
}
//滚动条滑下 导航条样式改变
window.onscroll = function () {
let scrollPos = getScrollTop();
if (scrollPos > 45) {
navbar.style.display="none"
// navbar.innerHTML="";
// navbar.style.border="none"
// navbar.innerHTML="<div class='searchactive'><img src='./images/login01.png'></div>"+"<div class='searchactive'><img src='./images/shopcart01.png'></div>"
searchactive.style.display="flex"
}else{
navbar.style.display="flex"
searchactive.style.display="none"
}
}
//获取购物车
var shopcart = document.querySelector(".shopcart>a");
var shopcartone = document.querySelector(".shopcart-empty>div")
shopcart.onmouseenter=function(){
shopcartone.style.display="block"
}
shopcart.onmouseleave=function(){
shopcartone.style.display="none"
}
var active = document.querySelector(".a-active");
var activediv = document.querySelector(".active-empty>div")
active.onmouseenter=function(){
activediv.style.display="block"
}
active.onmouseleave=function(){
activediv.style.display="none"
}
// 获取搜索框
var search = document.querySelectorAll(".search-input>a");
var searchdiv = document.querySelector(".search-input");
var searchinput=document.querySelector(".search-input>input");
var searchul = document.querySelector("#display")
searchinput.onfocus=function(){
search[0].style.visibility="hidden"
search[1].style.visibility="hidden"
searchinput.placeholder="请输入搜索的商品"
searchul.style.display="block"
}
searchinput.onblur=function(){
search[0].style.visibility="visible"
search[1].style.visibility="visible"
searchinput.placeholder=""
searchul.style.display="none"
}
</script>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手