（如图）网站左侧菜单栏，从一级菜单移动到二级菜单的过程中，鼠标移入其他一级菜单仍不消失的问题
自己也做过很多尝试，虽然大致实现了，但效果不是很好，有着这样或那样的问题，
跪求标准做法~~~~~~~~~~~~~~~
-
版主等级
本版专家分：3358结帖率 66.67% -
（如图）网站左侧菜单栏，从一级菜单移动到二级菜单的过程中，鼠标移入其他一级菜单仍不消失的问题
自己也做过很多尝试，虽然大致实现了，但效果不是很好，有着这样或那样的问题，
跪求标准做法~~~~~~~~~~~~~~~
展开阅读全文
-
版主等级
本版专家分：395875勋章
-
- 探花 2017年 总版技术专家分年内排行榜第三
-
-
进士
2018年总版新获得的技术专家分排名前十
2013年 总版技术专家分年内排行榜第五
-
-
金牌
2018年5月 总版技术专家分月排行榜第一
2018年4月 总版技术专家分月排行榜第一
2018年2月 总版技术专家分月排行榜第一
2017年8月 总版技术专家分月排行榜第一
-
-
银牌
2018年3月 总版技术专家分月排行榜第二
2017年11月 总版技术专家分月排行榜第二
2016年2月 总版技术专家分月排行榜第二
2014年2月 总版技术专家分月排行榜第二
2013年4月 总版技术专家分月排行榜第二
-
-
jd 电脑，办公那个是用div括起，弹出的子菜单是在这个div里面的，增加div :hover伪样式后显示出来。
你的结构要改成上面的，而不是主菜单和子菜单不在同一个容器下。不同容器你只能用setTimeout延时隐藏，鼠标移动出主菜单后判断是否移动到子菜单上，如果是清楚计时器，否则计时器执行隐藏操作。
-
版主等级
本版专家分：3358
-
我想要的是鼠标向右下移动过程中，子菜单仍旧显示，即使在移动过程中鼠标箭头经过其他的主菜单，如下：
-
等级
本版专家分：43132勋章
-
-
黄花
2010年12月 Web 开发大版内专家分月排行榜第二
2010年11月 Web 开发大版内专家分月排行榜第二
-
-
mouseover 设置子菜单div 显示
mouseout 用setTimeout 延时隐藏子菜单div
鼠标进入 主菜单或者子菜单时，先 清除定时器，再设置子菜单div 显示
-
版主等级
本版专家分：395875勋章
-
- 探花 2017年 总版技术专家分年内排行榜第三
-
-
进士
2018年总版新获得的技术专家分排名前十
2013年 总版技术专家分年内排行榜第五
-
-
金牌
2018年5月 总版技术专家分月排行榜第一
2018年4月 总版技术专家分月排行榜第一
2018年2月 总版技术专家分月排行榜第一
2017年8月 总版技术专家分月排行榜第一
-
-
银牌
2018年3月 总版技术专家分月排行榜第二
2017年11月 总版技术专家分月排行榜第二
2016年2月 总版技术专家分月排行榜第二
2014年2月 总版技术专家分月排行榜第二
2013年4月 总版技术专家分月排行榜第二
-
-
没研究过源代码，不过试了下效果，应该是判断了鼠标移动的轨迹了，右下移动有个延时显示子菜单，要是左向下移动子菜单马上显示出来了，有空再看了~
-
版主等级
本版专家分：3358
-
看上面这张 gif 的图，看鼠标的移动轨迹的两个阶段：
1. 垂直向下移动；
2. 往右下方移动（前往子菜单）。
第一个阶段，移动到哪个主菜单就hover哪个子菜单，以及显示其子菜单；
第二个阶段，从主菜单移向子菜单的过程，鼠标箭头经过了其他的主菜单，
【但他们（其他的主菜单）没有hover以及显示其子菜单】这个才是重点，这个才是我想弄明白的地方。
我把京东的左侧菜单栏给扣出来了（http://forwardnow.github.io/menu.html），
鼠标箭头移动到哪个主菜单上就显示哪个主菜单下的子菜单。
至于鼠标轨迹往右（右上或右下）时，如何判断是向右移动，这是个问题，
我的做法是：
给菜单栏注册 mousemove 事件， 初值坐标为 刚进入时的坐标；
移动过程中，取间隔的两个点的X坐标进行比较，
如果后一个点X值大于前一个点的X值，则判定为向右（右上或右下）。
但这种做法有很大的问题，一直难以解决。
-
等级
本版专家分：0 -
之前在做公司项目时也需要这个效果，先用了自己的方法，通过给li以及他下面的菜单容器div设置鼠标移入移出可以实现，过程中发现了一个更简单的方法，分享一下。
首先确定菜单结构，菜单里的展开内容要包裹在li，然后给li添加hover函数，
var timer = 0;
$( "li" ).hover( function() {
timer = setTimeout( function() {
//当触发hover就开始自动在300ms后执行展开菜单代码
}, 300 );
}, function() {
clearTimeout( timer );//当在300ms内移出了li，就清空计时器
} );
亲测可用，有不清楚的地方可以找我
- 一级菜单hover进入二级菜单，二级菜单不消失
设置一级菜单：hover效果显示二级菜单时，当鼠标从一级菜单移入二级菜单时，一级菜单因失去鼠标而导致二级菜单消失 根据一二级菜单DOM关系提出不同思路： 一级菜单包裹二级菜单 一级菜单 二级菜单
- 实现一个导航栏，鼠标滑入滑出效果展示。点击每个导航栏菜单，分别弹出对应内容
<template> <div class="list1"> <ul> <li&...菜单1</a> </li> <li> <a h
- jquery-鼠标经过导航条，显示二级下拉菜单
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="...
- 用jquery实现：悬浮菜单栏，鼠标指向二级菜单的时候，一级菜单不消失
` <style> * { padding: 0; margin: 0; } .body { height: 600px; width: 500px; border: 1px solid #00B0FF; margin: 50px ...
- Axure8实现左侧动态菜单的几种方法
以下实现的教程采用Ant design的界面模版进行分步说明，左侧动态菜单的实现方法关键在于怎么实现交互而不是设计规范，这里推荐大家在团队协作过程中使用规范的设计框架，网上有很多，可以自己找。特别是后台产品的...
- 1500个javascript特效
Alert只弹出一次 asf文件在线播放 ASP删除记录的方法 BrowserCheck脚本 cookie的写入 CSS使用大全 CSS的链接效果 CSS的鼠标影响 ctrl加回车提交 E-mail表单递交 E-mail递交 flash的超酷播放 Form中时间显
- Windows 快捷键
Windows 快捷键 ���¼���ԭʼ��ҳ��ӡ Windows快捷键大全_百度百科 1常见用法编辑 ...F10或ALT 激活当前程序的菜单栏 F11当你在打开网页时，是隐藏侧边栏 F12在...
- vue 多级菜单栏，鼠标移入显示鼠标移除隐藏
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>... ...
- Windows基础题目
1、Windows2000是一个多任务操作系统，这是指（ B）。 A）可供多个用户同时使用 B）可同时运行多个应用程序 C）可运行很多种应用程序 D）可同时管理多种资源 2、在Windows2000桌面上有某个应用程序快捷方式的...
- 没鼠标如何用键盘操作
如何利用键盘快捷键来创建一个新的Excel、Word文档？ 用键盘？不要鼠标可以通过以下两种方式用键盘开启程序 第一种方法：先WINDOWS键+R键，打开运行对话框 输入excel,就打开了EXCEL程序 输入winword,就打开了...
- 【京东详情页】——原生js爬坑之二级菜单
【京东详情页】——原生js爬坑之二级菜单 一、引言 做京东详情页仿写的时候，要用原生js实现顶部菜单的二级菜单显示与隐藏事件的触发。 过程中遇到了一个坑，在这里与大家分享。要实现的效果如下...
- elementUi侧边导航鼠标移入背景色，字体颜色改变
/* 改变elementui 侧边栏移入颜色 */ .el-menu-item:hover{ background: #1c88cf!important; color: #fff!important; } .el-submenu__title:hover { background: #1c88cf!important; color: #fff!...
- 湖南省计算机等级考试(二级)题库 第六部分
[参考答案B][A] 内存中的一块区域[B] 硬盘上的一块区域[C] 软盘上的一块区域[D] Cache中的一块区域[1002] 在Windows98操作系统中，对话框是( )。 [参考答案C][A] 大小可变的[B] 可任意设置的[C] 大小固定的[D] 带有...
- Word XP 中目录的编制方法,Word XP 功能键使用大全
Word XPWord XP 中目录的编制方法 1.单击要插入目录的位置。 2.指向"插入"菜单上的"引用"，再单击"索引和目录"。 3.单击"目录"选项卡。 4.若要使用现有的设计，请在"格式"框中单击进行选择。 5.根据需要，选择...
- 如果没有鼠标全用键盘操作电脑
单独按Windows：显示或隐藏 “开始”功能表 Windows+BREAK：显示“系统属性” 对话框 Windows+D：显示桌面 Windows+M：最小化所有窗口 Windows+Shift+M：还原最小化的窗口 Windows+E：开启“资源管理器” ...
- windows系统操作快捷键
发现有些实用的快捷键还自己还没有用上。真是浪费。这次搜集一下。暂时未整理就一股脑弄到这里。有空看看。 ...一、常用快捷键 ...F10或ALT激活当前程序的菜单栏 windows键或CTRL+ESC 打开开始菜
- 计算机基础知识理论试题
计算机基础知识试题一、选择题：本大题共30个小题，每小题1分，共30分，在每小题给出的四个选项中，只有一项符合题目要求，把所选项前的字母填在括号内。1.冯·诺依曼计算机的基本原理是 [ ]A.程序外接 B.逻辑连接 C...
- 函数防抖实现淘宝侧边栏效果
观察淘宝首页发现，淘宝的左侧导航栏在鼠标移入某一行时会显示对应的展示菜单，向下或向上移动鼠标，碰到另一行，就会显示对应的菜单，当鼠标快速移动在各行之间迅速切换，发现展示的菜单并不会随着鼠标的快速移动而...
- Word经典技巧大全
Word技巧 ★ 插入其它语种的特殊符号...1.插入符号法 单击“插入”菜单栏，选择“符号”命令，在里面可以选择拉丁语、希腊语等语种。 但是此法调用符号模块时间较长，加之在较大的篇幅内寻找需要的符号比较麻烦，因此
- PowerPoint制作技巧四则
PowerPoint制作技巧四则MicroSoft PowerPoint是个很实用的多媒体演示软件，但在具体制作过程中，你会为有些创作构想得不到软件的支持而苦恼。其实，变通一下就会柳暗花明。一、使剪贴画灵活改变颜色 在演示文稿中...
- Linux系统下操作的常用快捷键
虚拟控制台最有用的时候是当一个程序出错锁住输入时可以切换到其他虚拟控制台，登录进入后用kill命令杀掉这个出错的进程。 2.拷贝与粘贴 字符界面（不管是Slackware 还是RedHat 的）安装后，每次启
- vf程序设计
没有学到什么东西,如今,要用到这个东东,又得从头开始,下面是我做的一个小小的管理系统:人事管理系统 其实这个标题说的不太严密，因为任何一个能够正常执行的软件都可称之为完整的软件，而我们这里的意思是：一个有...
- word编辑技巧
1.2 编辑排版技巧(1)1.2.1 页面设置快速进行调整要对Word进行页面调整，通常大家采用的...1.2.2 Word中巧选文本内容在Word文件中进行编辑操作时，经常需选定部分文件内容或全部内容进行处理，请问有没有快捷的方法进
- 第十四讲 网页的动态效果
经常上网的朋友一定有过这样的体验，当打开某个网页时一张图片会慢慢移入，或者鼠标停到某个图片上它会变成另一幅图片，这就是DHTML，人见人爱的动态网页。 动态网页可让访问者和网页产生互动，使网页元素（文字、...
- Visio技巧总结
1、Visio画图时，两根直线交叉时，总是默认会出现一个跨线的标志，很是不爽，去除方法：选中线条，然后菜单的格式->行为->连接线->跨线->添加->从不，即可。 2、增加连接点。在连接线的按钮旁边有下拉按钮，选择...
- Windows 键盘快捷键概述
Windows 键盘快捷键概述在 Windows 中工作时，利用快捷键代替鼠标。可以利用键盘快捷 键打开、关闭和导航“开始”菜单、桌面、菜单、对话框以及网页。键盘还可以让您更简 单地与计算机交互。 单击一个标题或按 TAB ...
- js左侧边导航菜鼠标悬停展开二级菜单导航
js左侧边导航菜鼠标悬停展开二级菜单导航
- 教程：SQL Server Management Studio
此工具由 Microsoft Visual Studio, ...通过 Management Studio，您可以在同一个工具中访问和管理数据库引擎、Analysis Manager 和 SQL 查询分析器，并且能够编写 Transact-SQL、MDX、XMLA 和 XML 语句。 学习内
- JavaScript技术
● &运算符_1.htm● ·JavaScript的脆弱性_1.htm● ·JavaScript技巧环绕三维文字_1.htm● ·JavaScript时间显示三大心法_1.htm● ·Javascript特效欣赏(一)飘雪_1.htm● ·Java技巧（一）会变色的超链接_1.htm● ·...
- 抢茅台jd_seckill-master 来自huanghyw
本仓库发布的jd_seckill项目中涉及的任何脚本，仅用于测试和学习研究，禁止用于商业用途，不能保证其合法性，准确性，完整性和有效性，请根据情况自行判断。 本项目内所有资源文件，禁止任何公众号、自媒体进行任何形式的转载、发布。 huanghyw 对任何脚本问题概不负责，包括但不限于由任何脚本错误导致的任何损失或损害. 间接使用脚本的任何用户，包括但不限于建立VPS或在某些行为违反国家/地区法律或相关法规的情况下进行传播, huanghyw 对于由此引起的任何隐私泄漏或其他后果概不负责。 请勿将jd_seckill项目的任何内容用于商业或非法目的，否则后果自负。