I’m trying to look at and alter the style of some elements that display on click and hide when anywhere else on the page is clicked (it’s a modal popup). The problem is that clicking on the developer tools pane triggers the “click anywhere else” action, so the elements I’m trying to look at are being hidden.
How can I ignore clicks in the Chrome developer tools pane so the click action doesn’t fire?
(Tagging jQuery and Javascript because I’m not sure if it’s a problem with Chrome or if I need to load the script a different way.)
Advertisement
Answer
Ah, there is a nice trick for this.
Go to the Sources panel, and pause the script execution using “fn + F8” keyboard shortcut. (Hover over pause icon to see what the keyboard shortcut is for your OS)
Now use the element selector from top left corner of the dev tool to select the element of your choice and inspect its styles.