Manipulate a web browser to hide a certain HTML element in a certain website by a single action
Before I publish a new webpage in my website (in the content management system itself), I zoom in from say 100% zooming to 500% zooming and then re-read it, as a nice way to check for typos.
The problem is that a very certain initiated popup (a JavaScript popup appearing pretty much when the webpage starts) appears and in high zooming levels covers about 40% of the text so that each time I have to go to the browser's developer tools, inspect that popup element and set display: none to it.
I can automatically hide the popup with a user script, running from a user script manager on all webpages of my domain but I need a more focal approach such as some keyboard shortcut to set that element to display: none.
How would you do that?
I use Windows 10 but would prefer an approach different than AutoHotkey
2 answers
Following Alexei's comment I tried the following code which worked:
window.addEventListener('keydown', function(event) {
if (event.ctrlKey && event.altKey && event.key === 'l') {
document.querySelector(".cbntphone_icon").style.display = "none";
}
});
We listen to any relevant keyboard-key-down event in the browser window, per the if statement.
If Ctrl+Alt+l are pressed, than the element becomes hidden.
0 comment threads
An alternative to creating a userscript is to use a bookmarklet. This is a bookmark that contains an executable snippet of Javascript code. When you click on it, that code will get executed in the context of the current page. This has a few advantages vs. a userscript. You can easily control exactly when and how many times the script fires, and you can use it on any page (not just those you pre-configured the userscript to run on).
Leveraging the code in your answer, create a new bookmark in your browser and use the following as the URL:
javascript: (() => {document.querySelector(".cbntphone_icon").style.display="none";})();
Place that bookmark on your browser's "bookmarks toolbar" for ease of access. Now, whenever that popup appears, click on that bookmark and the popup will disappear.
I find this particularly helpful when modifying pages with dynamically generated content (i.e., ads that get created when reading down a page that uses "infinite scrolling"). Whenever I see a new ad get injected, I hit the button again to find and delete the ad. A userscript would run once, and any ad created after that point wouldn't be affected.
0 comment threads
2 comment threads