Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Forked version of tipsy with multiple pull requests applied.
JavaScript CSS Ruby
branch: master

This branch is 89 commits ahead of jaz303:master

Merge pull request #7 from Pitouli/patch-1

Remove recursive width diminution
latest commit 0be0545695
@CloCkWeRX authored
Failed to load latest commit information.
docs Pull request #100
src Remove recursive width diminution
.gitignore HTML test file excluded
LICENSE Reorganisation
README.md Merge github.com:Alexionfr/tipsy
Rakefile Version 1.0.0a

README.md

tipsy

Facebook-style tooltip plugin for jQuery

(c) 2008-2010 Jason Frame (jason@onehackoranother.com)

Released under The MIT License.

Description:

tipsy is a simple jQuery plugin for generating Facebook-style tooltips.

It's used by Twitter, Github, Slideshare and Bitbucket, amongst others.

Homepage:

http://onehackoranother.com/projects/jquery/tipsy

Source:

Hosted at GitHub; browse at:

http://github.com/jaz303/tipsy/tree/master

Or clone from:

git://github.com/jaz303/tipsy.git

Usage:

  1. Copy the contents of src/{javascripts,stylesheets} to the corresponding asset directories in your project.

  2. Insert the neccesary elements in your document's <head> section, e.g.:

    <script type='text/javascript' src='/javascripts/jquery.tipsy.js'></script>
    <link rel="stylesheet" href="/stylesheets/tipsy.css" type="text/css" />
    

    Remember to include jquery.tipsy.js after including the main jQuery library.

  3. Initialise Tipsy in your document.onload, e.g.:

    <script type='text/javascript'>
     $(function() {
       $('a[rel=tipsy]').tipsy({fade: true, gravity: 'n'});
     });
    </script>
    

Since jQuery 1.9, 'live' tipsy expects selector as live option, e.g:

    $(document).tipsy({
        live: '.live-tooltip'
    });

Shadow:

You can add shadow to Tipsy like this :

<script type='text/javascript'>
     $(function() {
     $('a[rel=tipsy]').tipsy({fade: true, gravity: 'n', shadow: true, shadowBlur: 10, shadowOpacity: 1, shadowSpread: 1});
   });
</script>

Please refer to the docs directory for more examples and documentation.

Something went wrong with that request. Please try again.