Hey everyone,
I've been toying around with a new version of the jTip plugin, which
was originally created by Cody Lindley.
This one is a complete re-write, and like Klaus's Thickbox Reloaded,
it uses the more jQuery-ish syntax. So, now you can do something like
this to have a jTip appear when you hover over a link:
$('a').jtip();
An example of the HTML markup would be:
<a href="http://www.learningjquery.com" rel="local-ajax-file.html"
title="about learning jquery">learningjquery.com</a>
It's in alpha stage right now, so don't expect it to perform
perfectly yet. I'm going to re-work the ajax options a bit and also
allow for showing content from the current page in the jTip. There
are a couple small issues with the CSS in IE6 (so what's new?) and
I'll probably borrow from Klaus's png fix for the drop shadow (if
he'll let me. :-) )
Here is a list of the currently working options:
# width: default is 275;
# attribute: default is 'rel'; set it to some other attribute of the
link to designate that attribute as the one that refers to the jTip's
content
# sticky: default is false; set to true if you want the jTip to
remain open when you "mouse out" of the link. This option also places
a "close" link on the jTip itself.
# closePosition: default is 'top'; set to 'bottom' to put the 'close'
link at the bottom of the jTip
# closeText: default is 'Close'; set it to something else if you want to
# hoverClass: default is an empty string; set to the name of the
class to add that class to the link on hover
# loadImage: default is 'wait.gif'; not implemented yet
# truncate: default is 0, which means there will be no truncation;
set it to some number to truncate the jTip's contents to n characters
# dataType: default is 'html'
Adding a jTip with options looks like this:
$('#examples a.myclass').jtip({
hoverClass: 'highlight',
attribute: 'name',
sticky: true,
closePosition: 'bottom',
closeText: 'Close [x]'
truncate: 80
});
If any of you would like to take a look, I would greatly appreciate
any feedback you have to offer. Here is the URL of a demo page with a
few notes:
http://test.learningjquery.com/jtip/
Also, I'm not crazy about the name (jTip), especially since this
version is quite a departure from Cody's original, so if anyone has
an idea for a new name, I'd love to hear it!
Oh, one more thing: Thanks a lot to Shelane Enos for compiling a list
of feature requests and motivating me to actually put this together!
thanks,
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com