qTip Tooltip

Testing qTip tooltips

by bluetidepro

HTML

<script src="http://akhost.chacha.com/chacha.com/infographics/jquery.qtip-1.0.0r54.min.js"></script>
<p>it  amero as dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est vs dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est vs dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est vs dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est vs dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est vs dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est vs dolor dui vitae justo. Sed vulputate neque sed quam.  Vestibulum sit amet risus. Vivamus est velit, tempus vel, condimentum  ac, commodo eget, velit.</p>
<p><a href="#" class="quote" title="test longer informaiton, just to test it and see what happens. What do you think will happen? I do not know! cool man!">Lorem ipsum dolor</a> sit amero as dolor dui vitae justo. Sed vulputate neque sed quam. Vestibulum sit amet risus. Vivamus est velit, tempus vel, condimentum ac, commodo eget, velit.<p><a href="#" title="test longer informaiton, just to test it and see what happens. What do you think will happen? I do not know! cool man!">Lorem ipsum dolor</a></p>

JavaScript

$(document).ready(function() {
    $.fn.qtip.styles.sheengraphic = {
        width: 230,
        fontSize: '12px',
        border: {
            width: 7,
            radius: 5
        },
        padding: 7,
        textAlign: 'center',
        tip: true,
        name: 'dark'
    }
    $('a.quote[title]').qtip({
        style: 'sheengraphic'
    });
});