检查仅在其他元素被鼠标覆盖/输入时出现的元素
Don*_*n P 118 javascript google-chrome-devtools
通常我想检查一个元素(例如工具提示),该元素仅在另一个元素被鼠标覆盖/输入时出现.出现的元素通过jQuery的mouseenter事件可见.
我无法检查工具提示,因为当我的鼠标离开包含元素时,工具提示会消失.
有没有办法暂停JS事件,所以我可以悬停在元素上,然后暂停浏览器的JS,并成功检查它？
例如,尝试检查Twitter bootstrap的工具提示:http://getbootstrap.com/javascript/#tooltips.
Som*_*Guy 222
在Chrome 38.0.2094.0中相当容易.
这是它的样子:
一步步:
- 在Sources面板中打开DevTools
- 将鼠标悬停在按钮上即可显示工具提示
- 按F8冻结页面
- 切换到"元素"面板,然后使用左上角的放大镜图标选择工具提示
如果工具提示因CSS而显示,那么在这种情况下您可以执行以下操作:
一步步:
- 打开DevTools
- 在开发工具中选择触发元素(链接)
- 右键单击,选择"强制元素状态",然后选择":悬停"
- 检查CSS工具提示
- 还有[LICEcap](http://www.cockos.com/licecap/),它直接在超级优化的GIF中记录屏幕的一部分.Windows,OS X和Linux. (5认同)
- 是的,我添加了一个GIF,以便更容易看到我在做什么. (3认同)
- @DonnyP我使用了`byzanz-record`.这是一个你可以通过`sudo apt-get install byzanz`获得的软件包. (2认同)
- @ bfred.it LICEcap不适用于Linux.[请参阅此Github问题](https://github.com/lepht/licecap/issues/1).似乎人们在[WINE](http://www.winehq.org/)上成功运行它. (2认同)
zıə*_*əʇs 15
无论Safari的和Chrome的Web检查提供的复选框,您可以切换的:active,:focus,:hover和:visited元素的状态.使用它们可能更容易.
苹果浏览器:
铬:
- 工具提示不是由`:hover`样式触发的. (5认同)
- Firefox上的Firebug具有相同的功能(减去`:visited`,这是限制以防止窥探) - 在HTML选项卡上,它位于右侧的"样式"下拉列表中 (2认同)
| 归档时间： |
|
| 查看次数： |
15159 次 |
| 最近记录： |