qTip2 - My test case

HTML

<script src="http://craigsworks.com/projects/qtip2/packages/nightly/jquery.qtip.js"></script>
<link rel="stylesheet" href="http://craigsworks.com/projects/qtip2/packages/nightly/jquery.qtip.css">
<a href="#test" title="Tooltip text">Sample link</a>
<div id="scroll">
  <table>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
        <button>tip</button>
      </td>
    </tr>
    <tr>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>Test Test</td>
      <td>
       ...

CSS

body {
  padding: 50px;
}

td {
  border: 1px solid;
  padding: 5px 10px;
}

#scroll {
  height: 300px;
  width: 400px;
  overflow: auto
}

JavaScript

// Create the tooltips only when document ready
$(document).ready(function() {
  // MAKE SURE YOUR SELECTOR MATCHES SOMETHING IN YOUR HTML!!!
  $('button').click(function() {
    var options = {
      position: {
        at: 'right center',
        // Position the tooltip above the link
        my: 'left center'
      },
      content: {
        text: "Some test text"
      },
      show: {
        event: 'click'
      },
      hide: {
        fixed: true,
        event: 'click'
      },
      style: {
        classes: 'ui-tooltip-shadow ui-tooltip-tipped'
      }
    };
    $(this).qtip(options);
  });


});