By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,890 Members | 1,048 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,890 IT Pros & Developers. It's quick & easy.

OT about CSS (other groups wont help)

P: n/a
hello all.
this is some CSS code that I have and it works great with links. however,
is it possible to achieve the same effect for images, buttons, regular text,
etc. ?

maybe make a new class called "tooltip" that i can apply to items throughout
the
site whenever/wherever i need a popup.

similar to the TITLE attribute, but much better to look at ;)

<style type="text/css">
..link a:link span{display: none;}

..link a:visited span{display: none;}

..link a:hover span {
position: absolute;
margin: 10px 0px 0px 10px; /*tooltip box*/
background-color: #E6F2FF;
padding: 5px 8px 5px 0px;
border: 1px dashed #336699;
font-weight: normal;
font-family: Verdana;
font-size: 8pt;
color: #336699;
text-align: center;
display: block;
</style>

<p class="link"><a href="#">link<span>this is a tooltip</span></a></p>

thanks all.
Jul 16 '05 #1
Share this Question
Share on Google+
4 Replies


P: n/a
In article <vk************@corp.supernews.com>,
"noone" <no***@nowhere.com> wrote:

: is it possible to achieve the same effect for images, buttons, regular text,
: etc. ?

Not easily without enclosing them in an anchor. Not in CSS. Lots of
"onMouseover" stuff around.
--
Looks like more of Texas to me.
.... Arizona, where the nights are warm and the roads are straight.
Jul 16 '05 #2

P: n/a
"Warren Oates" <Wa****@InHell.Com> wrote in message
news:Wa**************************@nr-tor01.bellnexxia.net...
In article <vk************@corp.supernews.com>,
"noone" <no***@nowhere.com> wrote:

: is it possible to achieve the same effect for images, buttons, regular text, : etc. ?

Not easily without enclosing them in an anchor. Not in CSS. Lots of
"onMouseover" stuff around.
--


thanks for the reply. at least now i know i can stop tinkering with it
and try something else.

i have javascript code that works fine, i just HATE javascript and would
love to get rid 100% rid of it ;)
Jul 16 '05 #3

P: n/a
"noone" <no***@nowhere.com> wrote in message news:<vk************@corp.supernews.com>...
hello all.
this is some CSS code that I have and it works great with links. however,
is it possible to achieve the same effect for images, buttons, regular text,
etc. ?

maybe make a new class called "tooltip" that i can apply to items throughout
the
site whenever/wherever i need a popup.

similar to the TITLE attribute, but much better to look at ;)

<style type="text/css">
.link a:link span{display: none;}

.link a:visited span{display: none;}

.link a:hover span {
position: absolute;
margin: 10px 0px 0px 10px; /*tooltip box*/
background-color: #E6F2FF;
padding: 5px 8px 5px 0px;
border: 1px dashed #336699;
font-weight: normal;
font-family: Verdana;
font-size: 8pt;
color: #336699;
text-align: center;
display: block;
</style>

<p class="link"><a href="#">link<span>this is a tooltip</span></a></p>

I'm so curious to know in which browser the above code worked for
you... In my IE6/XP, the above code doesn't work.
Jul 16 '05 #4

P: n/a
works fine here, ie6 xp and 2k.

"R. Rajesh Jeba Anbiah" <ng**********@rediffmail.com> wrote in message
news:ab**************************@posting.google.c om...
"noone" <no***@nowhere.com> wrote in message

news:<vk************@corp.supernews.com>...
hello all.
this is some CSS code that I have and it works great with links. however, is it possible to achieve the same effect for images, buttons, regular text, etc. ?

maybe make a new class called "tooltip" that i can apply to items throughout the
site whenever/wherever i need a popup.

similar to the TITLE attribute, but much better to look at ;)

<style type="text/css">
.link a:link span{display: none;}

.link a:visited span{display: none;}

.link a:hover span {
position: absolute;
margin: 10px 0px 0px 10px; /*tooltip box*/
background-color: #E6F2FF;
padding: 5px 8px 5px 0px;
border: 1px dashed #336699;
font-weight: normal;
font-family: Verdana;
font-size: 8pt;
color: #336699;
text-align: center;
display: block;
</style>

<p class="link"><a href="#">link<span>this is a tooltip</span></a></p>

I'm so curious to know in which browser the above code worked for
you... In my IE6/XP, the above code doesn't work.

Jul 16 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.