Is it possible to hide link address on hover?

Question

I have set up a chart with a lot of links and it really bugs me when it shows where the link goes in the bottom left hand side of the browser whenever you hover on a link, like so:

Is it possible to remove this? any method will do as long as I can hide/remove it (HTML, CSS, JS etc..)

Solution 1

The status bar highlighting happens only when you use an <a> element with a set href.

If you use pure JavaScript to open your link, and don't assign a href attribute, nothing will turn up in the status bar. I don't know how much control you have over the chart html, but if it renders <a> tags there's not much you can do.

You could try running javascript after the chart is renderred to attach onclick event handlers manually to all <a> tags and set href = '#'.

Solution 2

As said here: how can url be hidden in hyperlink when mouse hover

Don't put the URL in the href (or keep it href="#") and attach a JavaScript function to the onclick event which puts the actual link in the a element. This way you won't see the actual URL when hovering over the link but the link will be inserted when the user actually clicks.

Comments

[SaturnsEye]

Is that the only possible way then?

[Glenn Maynard]

And then you break everything about the link. like MMB-clicking to open in a new tab and the entire context menu. This is one of the most annoying mistakes novice web developers make.