You probably have noticed (really, you have already?) that if you click using any mouse button or using Enter, then the link will be highlighted with a blue background.


This blog is no longer using this, nor is YouTube. (2015-12-25T05:11:08Z)

The idea came from YouTubes new designed homepage, I noticed the link feature when its still experimental. I feel its a nice idea, especially you are watching video from a list selectively in new tab. You will know the position of the one you just finish watching, then you can move on.

I stole the idea but not the code, I didnt even use tool to read the code, JavaScript or CSS, its simple stuff. You only need to have I get an idea! And thats what I didnt have.

The code I made you can read the diffs, JavaScript diff and CSS diff. If you know them code, its simple code as I said. The only special thing I want to mention is margin compensates the extra space, which padding uses. The reason of adding padding is the edge of text will be touching the edge of the blue box if you dont use it.

Here are sample link styles with padding and without padding.

Since its possible to open a link using mouse or keyboard, so two events need to be handle.

My originally modified idea is having an indicator flying to new link where user just clicks. Indicator takes off from previous click, then flies to new link, but that seems to be too much and overdo. How about a simple background color fade in and out? Using CSS transition?

Try to press right mouse button with any link, like it?