How do I program TOOL TIP-like functions into my HTML pages?

  • Alan Lastufka
  • Proficient
  • Proficient
  • User avatar
  • Joined: Jan 21, 2004
  • Posts: 318
  • Loc: ChicagoLand, IL, USA
  • Status: Offline

Post January 23rd, 2004, 5:01 pm

You know those little pop-up boxes that appear when you put your cursor over an icon on a GUI? I'd like to add those to the bottons on my site because I'm getting complaints about the text from some being too hard to read... How do I do this?

I'm using Dreamweaver MX (not 2004)...

Thanks in advance.
Alan Lastufka | Fall of Autumn
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post January 23rd, 2004, 5:01 pm

  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Joined: Dec 20, 2002
  • Posts: 6382
  • Loc: twitter.com/unflux
  • Status: Offline

Post January 23rd, 2004, 5:03 pm

simply click on the button, open up the properties menu, and fill
in the Alt field with the text you want to display. :)
UNFLUX.FOTO
  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Joined: Dec 20, 2002
  • Posts: 6382
  • Loc: twitter.com/unflux
  • Status: Offline

Post January 23rd, 2004, 5:05 pm

oh -- and if you're not using the interface, just add this code
inside the img tag --
Code: [ Select ]
alt="your text"
UNFLUX.FOTO
  • Alan Lastufka
  • Proficient
  • Proficient
  • User avatar
  • Joined: Jan 21, 2004
  • Posts: 318
  • Loc: ChicagoLand, IL, USA
  • Status: Offline

Post January 23rd, 2004, 5:08 pm

Thanks very much!
Alan Lastufka | Fall of Autumn
  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Joined: Dec 20, 2002
  • Posts: 6382
  • Loc: twitter.com/unflux
  • Status: Offline

Post January 23rd, 2004, 5:11 pm

no problem :)
UNFLUX.FOTO
  • Axe
  • Genius
  • Genius
  • User avatar
  • Joined: Jan 07, 2004
  • Posts: 5744
  • Loc: Sub-level 28
  • Status: Offline

Post January 23rd, 2004, 6:20 pm

you can also use title="" in the a tag for text links (and it works with images too)..

Code: [ Select ]
<a href="whatever" title="This is what pops up">blah blah</a>


Hey, Unflux, as you can use both ALT and TITLE tax on something like...

Code: [ Select ]
<a href="whatever" title="something1"><img src="whatever.jpg" alt="something2"></a>


Which would show up on the tooltip? (Yeah, I know, I could just copy+paste that into a HTML file and see for myself, but I'm lazy, lol.
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Joined: May 28, 2003
  • Posts: 23407
  • Loc: Woodbridge VA
  • Status: Offline

Post January 23rd, 2004, 6:31 pm

Doing the same thing in manual coding, the alt tag always seems to take precedence over the title tag. I don't have any documentation to back me up on that, but from experience, the alt tag will be the one that displays.
"There's no place like 127.0.0.1 except for ::1."
Alexandria Networks. Leader in IT consulting for associations/non-profits, and small to medium sized businesses around the northern Virginia and Washington D.C. metro area.
  • Axe
  • Genius
  • Genius
  • User avatar
  • Joined: Jan 07, 2004
  • Posts: 5744
  • Loc: Sub-level 28
  • Status: Offline

Post January 23rd, 2004, 6:43 pm

Cool (I still haven't actually tested it though, lol).
  • rjmthezonenet
  • Expert
  • Expert
  • User avatar
  • Joined: Jan 14, 2004
  • Posts: 526
  • Loc: St. John's, Newfoundland, Canada
  • Status: Offline

Post January 26th, 2004, 9:53 pm

The TITLE attribute is the defined by the standard to server many purposes, and tool-tips is one of them. Unfortunately, support in some browsers is weak. I considered using it as a way to provide dictionary defintions to some works.

Another option is setting the visibility in CSS for relatively position windows (which opens up a whole world of creative possibilities).
  • yellow
  • Newbie
  • Newbie
  • No Avatar
  • Joined: Jul 09, 2003
  • Posts: 5
  • Status: Offline

Post January 29th, 2004, 5:54 pm

title will work for Opera, Moz, and IE. alt should be used if they have images off.
  • b0ksah
  • Newbie
  • Newbie
  • No Avatar
  • Joined: Feb 05, 2004
  • Posts: 10
  • Loc: Aarhus, Denmark
  • Status: Offline

Post February 5th, 2004, 8:23 am

Well ... here's some more advanced version of tooltips ..and others goodies :)

http://www.dynamicdrive.com/

Example:

http://www.dynamicdrive.com/dynamicinde ... ooltip.htm

Hope this helps you ;)
  • rjmthezonenet
  • Expert
  • Expert
  • User avatar
  • Joined: Jan 14, 2004
  • Posts: 526
  • Loc: St. John's, Newfoundland, Canada
  • Status: Offline

Post February 5th, 2004, 8:27 am

b0ksah wrote:
Well ... here's some more advanced version of tooltips ..and others goodies


Yeah, that's exactly what I'm talking about when I said, "another option is setting the visibility in CSS for relatively position windows...". Its cool stuff eh?

Thanks for sending the link. I thought about doing this, but never got around to coding it.

Post Information

  • Total Posts in this topic: 12 posts
  • Users browsing this forum: No registered users and 119 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.