老师，请问如何实现子菜单移入不隐藏，移出又隐藏
<!-- 导航 --> <div id="nav" class="nav"> <div class="wrap"> <!-- 左侧导航栏 --> <div class="nav_left"> <div class="menu"> <a href="#" class="classify"> <img class="pic" src="素材\icon\18.png" alt="18.png">商品分类 </a> <span class="item">家用电器<span>></span></span> <span class="item">手机、运营商、数码<span>></span></span> <span class="item">电脑、办公<span>></span></span> <span class="item">家居、家具、家装、厨具<span>></span></span> <span class="item">男装、女装、童装、内衣<span>></span></span> <span class="item">化妆、清洁、宠物<span>></span></span> <span class="item">运动户外、钟表<span>></span></span> <span class="item">汽车、汽车用品<span>></span></span> <span class="item">母婴、玩具乐器<span>></span></span> <span class="item">食品、酒类、生鲜、特产<span>></span></span> <span class="item">医药保健<span>></span></span> <span class="item">图书、音像、电子书<span>></span></span> <span class="item">彩票、旅行、充值、票务<span>></span></span> <span class="item">理财、众筹、白条、保险<span>></span></span> </div> <!-- 左侧导航栏 子目录 --> <div class="submenu_hide"> <!-- 家用电器 --> <div class="submenu"> <div class="lie"> <span>电器</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>冰箱</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>洗衣机</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>电脑</span> <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> </div> <div class="lie"> <span>微波炉</span> <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> </div> <div class="lie"> <span>开水壶</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>吹风机</span> <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> </div> <div class="lie"> <span>缝纫机</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 手机、运营商、数码 --> <div class="submenu"> <div class="lie"> <span>手机通讯</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>手机软件</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>摄影摄像</span> <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> </div> <div class="lie"> <span>数码配件</span> <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> </div> <div class="lie"> <span>影音娱乐</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能设备</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 电脑、办公 --> <div class="submenu"> <div class="lie"> <span>联想</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>苹果</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>显示屏</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>戴尔</span> <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> </div> <div class="lie"> <span>华硕</span> <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> </div> <div class="lie"> <span>打印机</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>照相机</span> <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> </div> <div class="lie"> <span>索尼</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 家居、家具、家装、厨具 --> <div class="submenu"> <div class="lie"> <span>复读机</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>MP3</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>乐视</span> <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> </div> <div class="lie"> <span>vivo</span> <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> </div> <div class="lie"> <span>oppo</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 男装、女装、童装、内衣 --> <div class="submenu"> <div class="lie"> <span>手机通讯</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>手机软件</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>摄影摄像</span> <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> </div> <div class="lie"> <span>数码配件</span> <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> </div> <div class="lie"> <span>影音娱乐</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能设备</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 化妆、清洁、宠物 --> <div class="submenu"> <div class="lie"> <span>复读机</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>MP3</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>乐视</span> <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> </div> <div class="lie"> <span>vivo</span> <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> </div> <div class="lie"> <span>oppo</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 运动户外、钟表 --> <div class="submenu"> <div class="lie"> <span>复读机</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>MP3</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>乐视</span> <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> </div> <div class="lie"> <span>vivo</span> <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> </div> <div class="lie"> <span>oppo</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 汽车、汽车用品 --> <div class="submenu"> <div class="lie"> <span>手机通讯</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>手机软件</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>摄影摄像</span> <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> </div> <div class="lie"> <span>数码配件</span> <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> </div> <div class="lie"> <span>影音娱乐</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能设备</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 母婴、玩具乐器 --> <div class="submenu"> <div class="lie"> <span>复读机</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>MP3</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>乐视</span> <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> </div> <div class="lie"> <span>vivo</span> <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> </div> <div class="lie"> <span>oppo</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 食品、酒类、生鲜、特产 --> <div class="submenu"> <div class="lie"> <span>手机通讯</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>手机软件</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>摄影摄像</span> <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> </div> <div class="lie"> <span>数码配件</span> <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> </div> <div class="lie"> <span>影音娱乐</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能设备</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 医药保健 --> <div class="submenu"> <div class="lie"> <span>电器</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>冰箱</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>洗衣机</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>电脑</span> <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> </div> <div class="lie"> <span>微波炉</span> <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> </div> <div class="lie"> <span>开水壶</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>吹风机</span> <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> </div> <div class="lie"> <span>缝纫机</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 图书、音像、电子书 --> <div class="submenu"> <div class="lie"> <span>手机通讯</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>手机软件</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>摄影摄像</span> <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> </div> <div class="lie"> <span>数码配件</span> <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> </div> <div class="lie"> <span>影音娱乐</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能设备</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 彩票、旅行、充值、票务 --> <div class="submenu"> <div class="lie"> <span>电器</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>冰箱</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>洗衣机</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>电脑</span> <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> </div> <div class="lie"> <span>微波炉</span> <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> </div> <div class="lie"> <span>开水壶</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>吹风机</span> <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> </div> <div class="lie"> <span>缝纫机</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> <!-- 理财、众筹、白条、保险 --> <div class="submenu"> <div class="lie"> <span>手机通讯</span> <a href="#">手机</a> <a href="#">对讲机</a> <a href="#">以旧换新</a> <a href="#">手机推荐</a> </div> <div class="lie"> <span>运营商</span> <a href="#">充花费/流量</a> <a href="#">170选号</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> </div> <div class="lie"> <span>手机软件</span> <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> <a href="#">手机支架</a> <a href="#">车载配件</a> <a href="#">拍照配件</a> </div> <div class="lie"> <span>摄影摄像</span> <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> </div> <div class="lie"> <span>数码配件</span> <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> </div> <div class="lie"> <span>影音娱乐</span> <a href="#">耳机/耳麦</a> <a href="#">音箱/音响</a> <a href="#">便捷/无线音箱</a> <a href="#">收音机</a> <a href="#">麦克风</a> <a href="#">MP3/MP4</a> <a href="#">专业音频</a> </div> <div class="lie"> <span>智能设备</span> <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> </div> <div class="lie"> <span>电子教育</span> <a href="#">学生平板</a> <a href="#">点读机/笔</a> <a href="#">早教益智</a> <a href="#">录音笔</a> <a href="#">电纸书</a> <a href="#">电子词典</a> <a href="#">复读机</a> </div> </div> </div> </div> <!-- 右侧导航栏 --> <div class="nav_right"> <a href="#">数码城</a> <a href="#">天黑黑</a> <a href="#">团购</a> <a href="#">发现</a> <a href="#">二手特价</a> <a href="#">名品汇</a> </div> </div> </div>
/* 导航 内部样式 */
.nav{
height: 50px;
background: #07111b;
}
.nav .wrap{
width: 1200px;
padding: 0;
}
.nav .nav_left{
width: 205px;
position: absolute;
top: -5px;
}
.nav_left .classify,
.nav_left .item{
display: block;
color: #fff;
background-color: rgba(232,20,20,0.9);
float: left;
font-size: 14px;
}
.nav_left .classify{
width: 205px;
height: 55px;
}
.nav_left .classify .pic{
padding: 20px 10px 0 20px;
}
.nav_left .menu{
width: 205px;
}
.nav_left .item{
width: 185px;
height: 37px;
line-height: 37px;
padding: 0 10px;
}
.nav_left .item span{
float: right;
}
.nav .nav_right{
line-height: 50px;
padding-left: 205px;
}
.nav_right a{
display: inline-block;
width: 100px;
color: #fff;
text-align: center;
}
.nav_right a:hover{
color: #c81414;
}
.submenu_hide{ /* 子菜单 */
}
.nav .submenu{
display: none;
height: 558px;
width: 728px;
background: #fff;
border: 1px solid #d9dde1;
position: absolute;
top: 55px;
left: 205px;
z-index: 2;
}
.submenu .lie{
height: 40px;
padding: 15px 30px;
}
.submenu .lie span,
.submenu .lie a{
font-size: 14px;
}
.submenu .lie span{
font-weight: bold;
float: left;
text-align:right;
width: 80px;
border-right: 1px solid rgba(128,128,128,0.5);
margin-right: 30px;
padding-right: 20px;
margin-bottom: 20px;
}
.submenu .lie a{
color: #808080;
margin-right: 10px;
}
.submenu .lie a:hover{
color: #f00;
}// 右侧导航 从左向右效果
$.fn.navFix = function(){
$('.fix').hover(function(){
$(this).find('span').stop().animate({
'right':'40px'
},500)},function(){
$(this).find('span').stop().animate({
'right':'-40px'
})
}).mouseover(function(){
$(this).css({'background':'#71777d'});
}).mouseout(function(){
$(this).css({'background':'#b7bbbf'});
})
};
// 购物车
$.fn.car = function(){
$('.carMenu').hide();
$('.car').mouseenter(function(){
$(this).css({
'border':'1px solid #808080',
'background-color': '#fff',
'background-image':'url(素材/icon/24.png)',
'color': '#f00'
});
$('.pic').attr('src','素材/icon/25.png');
$('.carMenu').show().mouseleave(function(){
$('.carMenu').hide();
});
});
$('.carMenu').mouseleave(function(){
$('.car').css({
'border':'0',
'background': 'url(素材/icon/23.png) #f01414 no-repeat 130px center',
'color': '#fff'
});
$('.pic').attr('src','素材/icon/26.png');
});
};
//左侧导航 隐藏的子菜单
$.fn.navLeft = function(){
$('.item').hover(function(){
var index = $('.item').index(this);
$(this).css({'background':'#fff','color':'#f00'});
$('.submenu').eq(index).show()
.siblings().hide();
},function(){
$(this).css({'background':'rgba(232,20,20,0.9)','color':'#fff'});
$('.submenu').hide();
});
/*$('submenu').mouseover(function(){
$('.submenu').show();
});*/
}
你好老师，麻烦看看代码哪里出问题，
还有如何实现子菜单移入不隐藏，移出又隐藏
0
收起
正在回答
2回答
同学你好，可以给外层大盒子一个鼠标移出事件。当鼠标移出时子菜单隐藏
如果帮助到了你，欢迎采纳~祝学习愉快~
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星