MyBB Community Forums

Heres what you'll end up with  


Copy paste this into your header include - Change the links for the files

  <script src="images/gamerx/jquery-ui.js"></script>
  <script>
  $(function() {
    $( document ).tooltip();
  });
  </script>

Then add this to the bottom of your global.css

.ui-tooltip {
        padding: 5px;
        position: absolute;
        z-index: 9999;
        max-width: 300px;
        -webkit-box-shadow: 0 0 5px #aaa;
        box-shadow: 0 0 5px #aaa;
        font-family: 'Alegreya SC', Georgia, serif;
        font-weight: 400;   
        font-size: 14px;
        color: #719DAB;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
        text-align: center;
        border: 1px solid #ccc;
        background: #fff;
        text-indent: 0px;
        border-radius: 3px;
        box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}

body .ui-tooltip {
        border-width: 1px;
}

Download:  [attachment=32404]

Including the whole jQuery UI (And uncompressed at that) just for tooltips isn't a great idea.

Nice tutorial Andrew.