Menu
Whenever I set a link to open up into a new window and return to the previous one the hover properties set for it stick but when I mouse back in to the window it changes back to normal. How can I fix this without using Javascript?
HTML:
<a href="google.com" target="_blank">Google</a>
CSS:
a:link, a:visited, a:active {color: blue;}
a:hover {color: red;}
JSFiddle
http://jsfiddle.net/5EXFB/
591
To remove the CSS hover effect from a specific element, you can set the pointer-events property of the element (the hover behavior of which you want to disable) to “none”.
A target attribute with the value of “_blank” opens the linked document in a new window or tab. A target attribute with the value of “_self” opens the linked document in the same frame as it was clicked (this is the default and usually does not need to be specified).
a target=”_blank” Open in New Browser Tab (or Window) The target attribute specifies where the linked document will open when the link is clicked. The default is the current window. If target="_blank" , the linked document will open in a new tab or (on older browsers) a new window.
You can use the target="_blank" attribute if you want your users to click on a link that opens up a new browser tab. The target="_blank" attribute is used inside the opening anchor tag like this.
I had a similar issue with a link styled as a button that was keeping its hover font color when the click action was to open a new window. The issue is that the link retains focus (which holds the hover style) until you click on something else, which is apparently an accessibility thing. The workaround I came up with is to add a :focus style and a :focus:hover style to mimic the regular a and a:hover styles.
a, a:focus { color: blue }
a:hover, a:focus:hover { color: white }
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
