我正在使用chrome检查器尝试分析twitter引导弹窗的z-index，并发现这非常令人沮丧……
是否有一种方法来冻结弹窗(而显示)，以便我可以评估和修改相关的CSS?
在相关链接上放置固定的“悬停”不会导致弹出窗口出现。
当前回答
让它工作。以下是我的步骤:
Browse to the desired page Open the dev console - F12 on Windows/Linux or option + ⌘ + J on macOS Select the Sources tab in chrome inspector In the web browser window, hover over the desired element to initiate the popover Hit F8 on Windows/Linux (or fn + F8 on macOS) while the popover is showing. If you have clicked anywhere on the actual page F8 will do nothing. Your last click needs to be somewhere in the inspector, like the sources tab Go to the Elements tab in inspector Find your popover (it will be nested in the trigger element's HTML) Have fun modifying the CSS
其他回答
我最近遇到了这个问题，按F8解决方案不适合我。下面是我如何冻结悬停元素。
在Chrome中右键单击鼠标悬停的标签，并在元素选项卡中选择它。 在右侧窗口中，选择事件侦听器 展开鼠标退出事件 单击此处显示的删除按钮。 现在，如果你将鼠标悬停在元素上，它将触发鼠标悬停事件，但当你的光标离开元素时，它不会触发鼠标退出，因为我们删除了它。
希望这能有所帮助。
右键单击元素标签中的任意位置 选择Breakon……>子树修改 触发你想要看到的弹出窗口，如果它在DOM中看到变化，它就会冻结 如果你仍然没有看到弹出框，在chrome顶部中心的Resume(F8)旁边点击Step over下一个函数(F10)按钮，直到你冻结你想看到的弹出框。
更新: 正如Brad Parks在他的评论中所写的，有一个更好更简单的解决方案，只需要一行JS代码:
运行setTimeout(function(){debugger;}，5000);，然后显示你的元素并等待它进入调试器
最初的回答:
我只是遇到了同样的问题，我想我找到了一个“通用”的解决方案。(假设站点使用jQuery)
Go to elements tab in inspector Right click <body> and click "Edit as HTML" Add the following element after <body> then press Ctrl+Enter: <div id="debugFreeze" data-rand="0"></div> Right click this new element, and select "Break on..." -> "Attributes modifications" Now go to Console view and run the following command: setTimeout(function(){$("#debugFreeze").attr("data-rand",Math.random())},5000); Now go back to the browser window and you have 5 seconds to find your element and click/hover/focus/etc it, before the breakpoint will be hit and the browser will "freeze". Now you can inspect your clicked/hovered/focused/etc element in peace.
当然，你可以修改javascript和时间，如果你明白了。
以前我的Chrome冻结功能不工作按f8快捷键，我使用这个走动，去源选项卡，只需点击暂停/播放脚本执行按钮在Chrome开发工具在源选项卡的右面板，我的快捷键得到了修复，并从那时开始工作，真的感谢充分，修复了我的问题
让它工作。以下是我的步骤:
Browse to the desired page Open the dev console - F12 on Windows/Linux or option + ⌘ + J on macOS Select the Sources tab in chrome inspector In the web browser window, hover over the desired element to initiate the popover Hit F8 on Windows/Linux (or fn + F8 on macOS) while the popover is showing. If you have clicked anywhere on the actual page F8 will do nothing. Your last click needs to be somewhere in the inspector, like the sources tab Go to the Elements tab in inspector Find your popover (it will be nested in the trigger element's HTML) Have fun modifying the CSS
推荐文章
- 改变引导输入焦点蓝色发光
- 我如何使一个div上的滚动条只在必要时可见?
- CSS:控制项目符号和<li>之间的空格
- 调试打印样式表的建议?
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 在JS的Chrome CPU配置文件中，'self'和'total'之间的差异
- 谷歌chrome扩展::console.log()从后台页面?
- 下一个元素的CSS选择器语法是什么?
- 未捕获的SyntaxError:
- 是否有'box-shadow-color'属性?
- 在jQuery中的CSS类更改上触发事件
- 我如何用CSS跨浏览器绘制垂直文本?
- Access-Control-Allow-Origin不允许Origin < Origin >
- 如何获得box-shadow在左侧和右侧
- 相对定位一个元素，而不占用文档流中的空间
