Pages

Copy Text From A Tool Tip

Wednesday, 25 February 2015
Today our QA team asked me if they could copy the text from a tool tip in a table. So I deciced to give it a try in JS fiddle. The hack requires you to use the jQuery UI tooltip. Below is the code.

HTML:
<table border="1px">
    <tr>
        <td class="test" title="Tool Tip 1">Test 1</td>
        <td class="test" title="Tool Tip 2"> Test 2</td>
        <td class="test" title="Tool Tip 3"> Test 3</td>
    </tr>
      <tr>
        <td class="test" title="Tool Tip 4">Test 4</td>
        <td class="test" title="Tool Tip 5"> Test 5</td>
        <td class="test" title="Tool Tip 6"> Test 6</td>
    </tr>
</table>

JavaScript:
$( document ).tooltip({
  items: '.test',
  close: function( event, ui ) {
    ui.tooltip.hover(
        function () {
            $(this).stop(true);
        },
        function () {
            $(this).remove();
        }
    );
  }
});
You can see the JS Fiddle here: http://jsfiddle.net/09yfud1c/1/

No comments:

Post a Comment