View Full Version : Resolved Permanent Screen Position for all Tool Tips?

11-07-2008, 02:37 PM
1) Script Title: Cool DHTML Tooltip

2) Script URL (on DD): http://dynamicdrive.com/dynamicindex5/dhtmltooltip.htm

3) Describe problem: Not exactly a problem but a variation...

Instead of the 'tip' positioning in relation to the cursor or the link, I would like to force the tip to position at a fixed position in the center of the screen...for all tool tips on the page.

I am using a multi-level CSS menu up near the top of the screen and I would like to use larger tooltips for info instead of a popup window. It would be a cleaner presentation for the user. I have plenty of open space in the middle of the screen and it would allow the whole menu & sub-menus to remain visible and, best of all...no pop-up windows!
The link the mouse is hovering over would remain active and the option to open a new window would be called out in the TIP text.

Just an idea, but I do not have the skills to modify this code.

11-08-2008, 05:58 PM
I've played around with this code and have gotten much closer to what I want, but still have some issues which I cannot resolve...

1. I have been able to force the tool tip to appear in a fixed position on the page (a test page) ...but when I install it into my webpage and preview it on my computer, the tool tip is hidden behind my content.
When I upload it to my site, the tool tip "text" appears in the upper middle of the page regardless of the position code, and the box does not appear.

the url for this page is:


place your mouse over "TOWEL WARMER" in the menu and the TEXT will appear at the top.

Sorry for posting the js script...it was NOT a part of this code! Up too many hours and starting to make mistakes!

Any help here is greatly appreciated as I am in way over my head...but too stubborn to give up!

11-09-2008, 01:56 AM
Could the problem be that the js script that comes with the DHTMTOOL TIP files also contains mouseover & mouseout codes?
If so, is there a way to combine the new function into the js script?

11-09-2008, 04:09 AM
I have resolved ALL of my issues.

The issue of the tootip being hidden behind the page was resolved by placing the tooltip DIV and remaining html AFTER the last sub-menu...not before.
Instead of the sub-menu being the last thing before </body>, the tooltip is.
I believe (but I don't really know) that there was a conflict between nouseover & nouseout commands in the tooltip and in the menu.
If you actually know the real answer, please let me know! It was just a hunch and it worked. It just seemed like the right thing to do.

The next problem was to force it into a fixed position on the page. This was done by removing all of the X & Y references in the javascript which then allowed me to give the tooltip an absolute page position in the script.

All that was left was to modify the css attributes to my liking.

You can see the modified code here:

The reason for all this:
With the multi-level menu, I had to have info for almost all of the menu items. I didn't want new windows opening constantly. I found it annoying to have the tooltip cover over the menu, as well as move with my mouse. I found that I could get better concentration on the menu and its levels if I could read the 'tip' in the same spot for all of the items. The brain likes the predictability of exactly where to focus for the info.
Better concentration and a cleaner looking menu means better business.
May be a little crazy but it works for me.

Many thanks to those who created this code, as I never could have made this happen.