What's the quickest/easiest way to place text boxes over an image which is also a link to another page; so that people can see the boxes when they pass the Mouse over that area where the link "hand" is seen, and upon removing the Mouse, the text box disappears.
For example, I have a sliced picture of a set of library books. I have made each slice into a link to another page in the website. If I move my Mouse over (say) the first slice of the image, I want to see that it is going to take me to a page called "Medieval Castles"; then I click on the link and I am there, and the box has disappeared until I return to the page where the sliced image is.
I would appreciate a reply in plain language, so that my feeble brain can totally understand what I must do to achieve this task. Thank you, Kes.
I don't think you really mean "textboxes". Usually people call those little helper things "tool tips".
Although browsers support the "ALT" attribute of an image in different ways, many of them will display the "ALT" text when the mouse is over the image. In modern W3C compliant browsers (NS 6+, IE 5+, Mozilla), the "TITLE" attribute is used to display text on mouseover, and this is what the attribute was introduced to do.
I wanted to thank you both for replying so promptly to my question. Even though I couldn't work out how to do it, I am grateful that you took the time to assist me. Because I really wanted to know the answer, I emailed a teacher of Dreamweaver/Fireworks Programmes with whom I did a course in 1999. He very graciously replied immediately with the following information - which I applied, and IT WORKED! If you use Dreamweaver/Fireworks, it is just so simple to do this:
1. select the sliced (or unsliced) image in the document;
2. choose the Properties panel
3. type your alternate text into the "Alt" field on the right of the panel. Save the page and check it in the Browser.
For the HTML buffs, use the following code:
<img name="bookcase_r1_c1" (or whatever you want to call it)src="Images/bookcase_r1_c1.gif"(space)width="63" height="200" border="0"(space) alt="Castles of Count Leslie"(type your own text in the Alt box)>
The parenthesis is mine of course. It should work in most HTML programmes.
(PS: the website is here, if you are interested - check out the Library Room for the above text boxes: http://www.clanleslie.org)
Good luck - Cheers, Kerry
But<img name="bookcase_r1_c1" src="Images/ bookcase_r1_c1.gif" width="63" height="200" border="0" alt="Castles of Count Leslie"> is wrong, as Stefan and gil have been trying to explain. It's typical of users of Dreamweaver to not understand that HTML needs to work on different kinds of browsers, including Braille and audio. The ALT text specifies a text to be displayed when the image cannot be and is required. (http://www.w3.org/TR/html4/struct/objects.html#adef-alt) The TITLE attribute is what you want. It's only Microsoft that confuses the two. Which is to say, if you persist then your page fail not only on Braille and audio browsers, but also on Graphical ones. Use the TITLE attribute for tool tips. (http://www.w3.org/TR/html4/struct/gl...tml#adef-title)
Thank you Charles for that information. In Dreamweaver, I always entitle my pages - however, since reading about "Titles" in HTML, I guess I can be more specific in my description in future. Best regards to you.
Originally posted by kes3 Thank you Charles for that information. In Dreamweaver, I always entitle my pages - however, since reading about "Titles" in HTML, I guess I can be more specific in my description in future. Best regards to you.
You are a bit confused.
In HTML there is both the entity <title> and an attribute title="".
<title> is for naming your entire page.
The attribute title="" will give you a popup
<img title="this is a popup" ...
Originally posted by Klyve1
I do know that Mozilla doesn't like ALT tags for images - they don't work.
On the contrary, in Mozilla ALT works just as it should. It shows up INSTEAD of the image when the image is not shown for whatever reason, just as the HTML spec sais it should.
It is a BUG in IE that it uses it AS TITLE when the real TITLE is missing.
Only TITLE should appear as a popup when you mouse over an image.
I've not tried TITLE for images but for links they work fine in Mozilla.
You will find that also the implementation of TITLE is superior in Mozilla. You can place it on almost ANY tag in HTML, <p> <span> <div> etc etc just as the SPEC say you should be able to do.
This means you can put tooltip popups on basicly ANYTHING on your page.
Sadly, no other browser I know of gets that right