PDA

View Full Version : Cool DHTML Tooltip II - Arrow only on left-top position



HolziFFB
10-14-2005, 09:34 PM
I like this script (http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip2.htm). It's great!

The problem is , that the little arrow appears only on left top position of the tooltip.
If there is not enough room to the right or to the bottom of the page the tooltip switches to the left or over the cursor. That's cool, but without arrow!
At this point I have to tell that I've read the note on top of the scripts page :)

OK- if it's possible to check the position of the tooltip to the window frame and switch it, it should be possible to tell the arrow pointer (or an mirrored version of it) where it has to appear.

It's not that important, but if anybody has a clue please answer here or notify me: holziffb@gmx.de

Thanx and greetings from Bavaria
HolziFFB

(Sorry - my english isn't that good anymore)

ddadmin
10-14-2005, 10:33 PM
This is noted in the description:



Note that the pointer image disappears if the tooltip is too close to the edges of the browser window.


When creating the script, accounting for the arrow showing up in all cases didn't seem too important versus the extra code and work required to realize it, so I decided to leave it out.

HolziFFB
10-14-2005, 10:50 PM
Thanx ddadmin for your fast reply (and the good work on this URL and the scripts :D ).

I've already thought that a lot of extra work was the reason. But I still hope that somebody reading this has a ready-to-use script that solves my problem.

Greetings
HolziFFB

Ickyb0d
12-07-2005, 09:35 PM
heh funny, because i needed this functionality and just kind of made it and wondered if anyone (or the original author) had tried the same. I mainly wanted to get rid of the image usage and also be able to match colors with the tip box and the arrow. Here is my page that demonstrates it and you should just be able to pull the javascript and css from...

/tooltip.js
/tooltip.css

Demo located here...
http://schoolinsummertime.com/tooltip/tooltip.html

one qurik... this only seems to work in FireFox 1.5? and not 1.0? but it works in IE fine, and i haven't tested opera. Any clues as to why this might not work in FireFox 1.0?

HolziFFB
12-07-2005, 10:03 PM
Thank you,

your script is easy to install, easy to use, and works pretty good !!!
Probaly you may take a look at my homepage. It's already implemented in the startpage.

Greetings from Bavaria
Holzi

Null
02-13-2006, 11:51 AM
It doesn't work in Opera. I need this also but want it all browser compatible. I myself am a Opera user and would really want this to work in Opera too!

ddadmin
02-14-2006, 12:24 AM
It doesn't work in Opera. I need this also but want it all browser compatible. I myself am a Opera user and would really want this to work in Opera too!

What version of Opera is that? I tested the script in Opera 8.5 without problems...

Null
02-14-2006, 01:27 PM
What version of Opera is that? I tested the script in Opera 8.5 without problems...
I am talking about this version http://schoolinsummertime.com/tooltip/tooltip.html the original one works just fine!

HolziFFB
02-14-2006, 04:55 PM
@Null
Since I have not installed Opera, would you please be so kind and check my homepage www.holziffb.de and mail the result to info@holziffb.de

Thanks a lot

Null
02-14-2006, 05:53 PM
Done, also added a screenshot of what Opera users see with the modified version.

(modified version http://schoolinsummertime.com/tooltip/tooltip.html )

Can someone fix this?

Thx

ddadmin
02-15-2006, 09:28 AM
Hmmm I'll have to come back to this thread when I have time to try and decipher what the problem may be in Opera. The default version on DD does work in Opera obviously, just not the modified version posted by Holzi. If there is a demand for this, I may just try and create a version with 4 pointers, as that may be easier than trying to fish out browser quirks inside a foreign code.

Note: Even for modified versions of DD scripts, please note that the original credit notice must remain intact in the page's source, per our usage terms (http://www.dynamicdrive.com/notice.htm).

Null
02-15-2006, 09:43 AM
If this works just as the modified one, I would like 1. It's not only more functional, but also more userfriendly. The current version just jumps free if it hits a border, this modified one just flips. On a page with many links, this can be confusing, but if it just flips it isn't.

I also request a static option. So the tooltip isn't "connected" to the mouse but to the link itself...

Null

Null
02-23-2006, 06:15 PM
FOund another bug, happens in ALL browsers. It uses some patience to do this, but try moving you mouse to the border. Just when it hits the border, stop moving. De tooltip and image arn't connected anymore. See the image I provided to see what i mean.

Some updates of this script (especialy for Opera users) would be nice....

Null

Ickyb0d
05-11-2006, 08:49 PM
wow, that is one heck of an error, heh. yeah, i made that mod... hrm, perhaps i should check this forum more often. maybe if i get some time i'll see if i can fix that. i'm not too familiar with JS in Opera though... i'm guessing some of the methods i used weren't compliant with it... but i try to stick to w3c standards. if i do get a fix, i'll post it here.

i'm also aware of the deconnectivity error, but it seems to only happen for like a split second any time that i've done it in IE or FF... like i said, heh, i haven't tested it in opera. this may simply have to do with some javascript events not lining up correctly.

ak7861
04-19-2007, 08:29 AM
Your 4 pointer script also has another bug on Opera. Notice it adds spacing to the left of the window. You can fix it by first removing all the left:-300px in the css then remove the left:-1000px in the js. Works fine on all browsers then. :)

kavitakawade
04-07-2008, 07:01 AM
how to take out the shadow from the tooltip in IE

rangana
04-07-2008, 07:07 AM
Find this in your CSS:


filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);


If you hate to see those shadows, then feel free to remove or comment out (//) this line ;)