Topic: ParaTip - Lightweight jQuery tooltip plugin.

[psp83]

Dunno if anyone is interested but here's a plugin I created for a site I was making.

Its a simple lightweight jQuery tool tip plugin. http://bit.ly/cOwKk1

[Simon]

Haven't a clue what it does, but thanks Paul. 

[Rik]

That makes two of us. I guess it falls into the 'if you have to ask you don't need it' category.

[psp83]

If you go here http://www.paulparadise.co.uk/demos/paratip/demo.htm and mouse over the link you will see a tooltip appear.

Its for that 

 

[Rik]

Thanks, Paul, definitely confirmed my thoughts.

[Simon]

Oh right!  That's actually quite cool. 

[sam]

that's quite nice - I like the background but why not just to this in the CSS - I guess why the javascript?

Just todo this in css is simply:

Code: [Select]

<style type="text/css">
.ToolText{position:relative; }
.ToolTextHover{position:relative;}
.ToolText span{display: none;}

.ToolTextHover span{
  display:block;
  position:absolute;
  border:1px solid black;
  top:1.3em;
  left:5px;
  background-color:gray; color:white;
  text-align: center;
}
</style>
calling in the website with:

Code: [Select]

<p class="ToolText" onMouseOver="javascript:this.className='ToolTextHover'" onMouseOut="javascript:this.className='ToolText'">

This is the text that will cause the tooltip

<span> And this is the Tooltip's text </span></p>

[psp83]

You can do it many ways but I decided a jQuery plugin was easier to use. Plus I hate inline JS 

Also another reason was because, I'm starting to get fed up downloading a 3rd party plugins that are over 80+ kb in size to do a simple tooltip. The one I coded above for a site I'm building is less than 2kb.

 

[sam]

yes I agree on the inline JS (I guess I meant jQuery more than javascript before).

I see what you are saying about the 2kb, much nicer solution, however, how big is jQuery? I assume you have to have this installed on your server? I've not used that before. Actually I tend to avoid javascript if possible

[psp83]

yes I agree on the inline JS (I guess I meant jQuery more than javascript before).

I see what you are saying about the 2kb, much nicer solution, however, how big is jQuery? I assume you have to have this installed on your server? I've not used that before. Actually I tend to avoid javascript if possible

You just download it from http://jquery.com/ and call it like any other javascript file in the head tags.

Its a JS library that allows drag&drop, animations etc.

Jquery script itself is about 24kb.

It makes life alot easier.

To hide a div all you have to do is $('.divclass').hide(); or $('#divid').hide();

or do something like this

Code: [Select]

$(document).ready(function(){
    $('.hidemessage').click(function() {
$('#message').hide('fast');
     });
});

If you add class="hidemessage" then click what you've added it to, it will hide the div that has the id message.

[Simon]

I'm glad you two know what you're talking about! 

[Rik]

I'm just keeping quiet.

[Simon]

They'll ignore us anyway. 

[Rik]

 

[sam]

Jquery script itself is about 24kb.

Ok - so not that heavy then... hmm, might have to have a play - though I still prefer server side stuff.