/    Sign up×
Community /Pin to ProfileBookmark

hoover item

Copy linkTweet thisAlerts:
Mar 03.2004

Hi,

I need to show “>>” (the greater than sign) next to an item when the cursor hoovers over the item. How can I do this with CSS/html.

Thanks,
Leo

to post a comment
CSS

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@JonaMar 03.2004 — [font=arial]It will only work on anchors (links) in IE, but other browsers support the :hover attribute on just about anything. I'd suggest using :hover and changing the background-image to some sort of arrow, and aligning the background image to the left. You might have to make the text-indent increased a few pixels for it, though.[/font]

[b][J]ona[/b]
Copy linkTweet thisAlerts:
@VladdyMar 03.2004 — For pure CSS solution you would need to use anchor element for text you hover upon (because of the IE dumbness)

<style type="text/css">

.hovered span

{ display: none;

}

.hovered:hover span

{ display: inline;

}

</style>

<a href="#" class="hovered" onclick="return false;">Hover here<span> &gt;&gt </span></a>

EDIT: No need for image....
Copy linkTweet thisAlerts:
@JonaMar 03.2004 — [font=arial]Nice, Vladdy. I didn't think 'bout that one![/font]

[b][J]ona[/b]
Copy linkTweet thisAlerts:
@VladdyMar 03.2004 — Also you can ammend the IE's inability to recognize hover for other elements by using a very simple behaviour:

www.vladdy.net/Demos/IEPseudoClassesFix.html
Copy linkTweet thisAlerts:
@JonaMar 03.2004 — [i]Originally posted by Vladdy [/i]

[B]Also you can ammend the IE's inability to recognize hover for other elements by using a very simple behaviour:

www.vladdy.net/Demos/IEPseudoClassesFix.html [/B][/QUOTE]

[font=arial]Sweetness! Thanks! ?[/font]

[b][J]ona[/b]
×

Success!

Help @leonard905 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.2,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...