How to inspect JQuery UI tooltip?
google-chrome, javascript
Solution
My working solution in Firefox: 1. hover over tooltip (tooltip is shown) 2. hit `CMD-Option-K` (OSX) or `CTRL-Shift-K` (Windows), to open "Web Console" 3. type "debugger" (this will stop JS execution, so tooltip won't disappear) 4. open "Inspector" Tab, search for `.ui-tooltip` 5. edit as necessary. note: changes to CSS will work immediately, even if execution of JavaScript is stopped
Problem
I have a default JQuery UI tooltip function call on my page. Is there a way to style the tooltip div interactively using the Inspector? If I had two mouse pointers, one would be hovering over an element to keep the tooltip displayed and second would be using the Inspector and build the style. But I only have one mouse and as soon as it moves off the element, the tooltip disappears. Checking the ":hover" state in Inspector doesn't help. the tooltip disappears on mouse out. I am using Chrome, but any trick in any browser would do.