Improve company productivity with a Business Account.Sign Up

x
?
Solved

How do I make plain text have the alt=Description on mouseover like a image has

Posted on 2009-04-04
6
Medium Priority
?
254 Views
Last Modified: 2013-12-24
How do I make plain text have the alt=Description on mouseover without adding a image.
Like a image.

<img src="images/lens.gif" alt="Click to view plan details" width="18" height="18">

On mouse over you see the alt text in a little balloon by the pointer.

How is that done with plain text wothout making it a link or a image.
0
Comment
Question by:LeadCo
  • 4
  • 2
6 Comments
 
LVL 27

Accepted Solution

by:
azadisaryev earned 2000 total points
ID: 24070049
if you are on cf8, you can do it as easy as

<p>this is some <cftooltip tooltip="with a tooltip created using <cftooltip> tag!"><u>text</u></cftooltip></p>

Azadi
0
 

Author Comment

by:LeadCo
ID: 24070065
Yes it works great in CF8.  Is there a way to make it stay up as long as they have their pointer on it. It fades out a bit fast and I am showing some lengthy definitions for insurance terms. Is their a way to make it stay visible till moved.
0
 
LVL 27

Expert Comment

by:azadisaryev
ID: 24070076
and if you are not on cf8 yet (or even if you are!), check out these 2 tooltip plug-ins for jQuery javascript library. they both are great, easy to setup and customize, and allow you a lot more control over the look of the tooltip than <cftooltip> tag:

http://jquery.bassistance.de/tooltip/demo/
http://www.codylindley.com/blogstuff/js/jtip/

Azadi
0
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

 
LVL 27

Expert Comment

by:azadisaryev
ID: 24070095
> Is there a way to make it stay up as long as they have their pointer on it

<cftooltip> tag has some useful attributes you can sue:
autoDismissDelay - The number of milliseconds between the time when the user moves the mouse pointer
over the component (and leaves it there) and when the tool tip disappears. (defaults to 5000 = 5 seconds)

hideDelay - The number of milliseconds to delay between the time when the user moves the mouse
pointer away from the component and when the tool tip disappears. (defaults to 250)

showDelay - The number of milliseconds to delay between the time when the user moves the mouse
over the component and when the tool tip appears. (defaults to 200)

sourceForTooltip - The URL of a page with the tool tip contents. The page can include HTML markup to
control the format, and the tip can include images. If you specify this attribute, an animated icon appears with the text "Loading..." while the tip is being loaded.

check out cfml reference manual for other attributes.
but, really, do check out those jquery plug-ins - they will give you A LOT more control over the tooltips!

Azadi
0
 

Author Comment

by:LeadCo
ID: 24071627
The jquery was the ticket thanks. Since it was really another question i have it open. Copy comments in there if you want and i will award points. i will close it later today.
0
 
LVL 27

Expert Comment

by:azadisaryev
ID: 24071642
no worries, i am not here for the points, really...
glad i could help!

Azadi
0

Featured Post

Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

If you don't have the right permissions set for your WordPress location in IIS, you won't be able to perform automatic updates. Here's how to fix the problem.
What You Need to Know when Searching for a Webhost Provider
The purpose of this video is to demonstrate how to insert an Iframe into WordPress. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp-login.php : Open Page or Post…
The purpose of this video is to demonstrate how to add AdSense Ads to a WordPress Website, and how to set up WordPress to automatically place Ads in Sidebars. This will be demonstrated using a Windows 8 PC. Log into your AdSense account. : Cli…

585 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question