Question?, hoping its not that hard...

User 1886497 Photo


Registered User
148 posts

Is there a way that when you hover over a word on a website it can the show you a description of what that word means for example 'Diet Coke' if you hovered over it, it would say 'Diet coke is part of the coca cola company' I can do it when I create a link but I do not want the word to link to anything.

Also if you click on the S-Drive on here a pretty slick window pops up telling us its in trial, how would I create such a window.

I have an over basic understanding of website design so any help big or small would be much appreciated

Thanks.
Karl Williams.
www.karlwilliams.co.uk
User 133269 Photo


Registered User
2,900 posts

the title="" on an image will also make a tiny message bit appear - maybe you could play with that...?

otherwise a bit of javascript and css would probably be the way...

hmm - and if its a css popup for images you're after search "lightbox"
for basic css popups try
http://www.dynamicdrive.com/dynamicinde … /index.htm
Have fun
~ Fe Pixie ~
User 92156 Photo


Registered User
272 posts

Hi, re the "hover":
I use CC Editor but my knowledge of coding is very basic - I tried this little bit of code in a new page:

<a class="hover" href="" title="This is a link">Hover Over This</a>


Basically it's a link with nowhere to go (href=""), it seems to work in FireFox and IE7 OK, i.e. the text in the title="etc" attribute shows up on mouse hover, but ...
clicking on it in IE7 brings up Windows Explorer and shows the local disc directory I'm working in - I don't know how this will work after being uploaded to a server as I haven't tried it.

Also there are probably reasons why this method is "not a good idea" e.g. I bet it sets up an error when validated, so I'm hoping someone with more coding savvy than me will set me straight if necessary.

PS use the class="hover" (or whatever you want to name it in your *.css file) to make the words look like regular words and not like the standard blue underlined link, if that's how you want it.
User 271657 Photo


Ambassador
3,816 posts

It sounds like you're wanting a modal box:

http://okonet.ru/projects/modalbox/

There's many more where this came from, just Google it to find out more :)
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 1948478 Photo


Senior Advisor
1,850 posts

Zipper's suggestion, which is kind of a variation on Fe's suggestion, is probably the simplest and most direct way to provide a 'hover-comment'.
And if you replace href="" with href="#nogo", there should not be any problems with functionality or validation.
User 364143 Photo


Guest
5,410 posts

Try a word bubble. http://trentrichardson.com/2006/12/02/css-bubble-tooltips/
CoffeeCup... Yeah, they are the best!
User 1886497 Photo


Registered User
148 posts

Thanks for the answers and idea's all great, much appreciated. :)
Karl Williams.
www.karlwilliams.co.uk

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.