qtip2 example

by kuyabiye

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.css">
<div style="overflow: auto; height: 450px">
<a href="#" title="Test">Hello</a>

    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p> <a href="#" title="Test">Hello</a>

    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p>
    <p>lorem ipsum sit dollar amet</p> <a href="#" title="Test">Hello</a><a href="#" title="Test">Hello</a><a href="#" title="Test">Hello</a>

</div>

JavaScript

$('[title!=""]').qtip({
    style: {
        tip: {
            mimic: 'center',
        }

    },
    position: {
        my: 'bottom right', // Position my top left...
        at: 'top right', // at the bottom right of...
    },
});