Learning jQuery: myTip .3 Beta

You can read this if you want but the real v.1 is here

I decided to try and create a custom tool tip and it worked out pretty well. I had to utilize a funny attribute to make it work (the rev attribute… WHAT??? that’s what I said. go ahead check w3c ( ; )… But it Does. I just need to work on customizing the positioning. so if the browser isn’t wide enough or to pop out to the left instead of the right etc.

I am using a Google hosted jQuery 1.4 take a look below.

This is some Anchor Text Hover over it

you can make the link do nothing too! but I have a tip! just set the href to #

This is out it works

You must be careful with quotes ” ” you must make sure you use ‘ ‘ instead of ” ” use the opposite of what you are using for your attributes.

It works in all the browsers as far as I know… (I haven’t tested in chrome or opera though)

While researching other custom tool tips they all require you to add a chunk of code to the bottom of your content who has time for that???

With this solution all you have to do is set the rel=”mytip” and then put whatever you want in the rev=”" attribute for your tip. It requires jquery 1.4, the code I wrote to make it happen, and then a .mytip class for css

you can view the source below this sentence to cut and paste the .js and .css (all of it i’m linking to googles jquery)

Blessings,
Richard Lee

Leave a Reply