title: Make spin.js spinner's position relative to the target div
body: <p>currently the jQuery spin.js spinner has options to position it.</p>
  
  <p>I have used the following config before:</p>
  
  <pre><code>        // set up spin.js vars
      var opts = {
          lines: 13, // The number of lines to draw
          length: 5, // The length of each line
          width: 2, // The line thickness
          radius:5, // The radius of the inner circle
          corners: 1, // Corner roundness (0..1)
          rotate: 58, // The rotation offset
          direction: 1, // 1: clockwise, -1: counterclockwise
          color: '#fff', // #rgb or #rrggbb or array of colors
          speed: 0.9, // Rounds per second
          trail: 100, // Afterglow percentage
          shadow: false, // Whether to render a shadow
          hwaccel: false, // Whether to use hardware acceleration
          className: 'mySpinner', // The CSS class to assign to the spinner
          zIndex: 2e9, // The z-index (defaults to 2000000000)
          top: '50%', // Top position relative to parent
          left: '50%' // Left position relative to parent
      };
  
      // show a spinner in place of the icon
      var target = document.getElementById('testdiv');
      var spinner = new Spinner(opts).spin(target);
      $(target).data('mySpinner', spinner);
  </code></pre>
  
  <p>However the position shows its relative to its parent.</p>
  
  <p>So currently the structure of:</p>
  
  <pre><code>&lt;div id="container"&gt;
    &lt;div id="testdiv"&gt;
    &lt;/div&gt;
  &lt;div&gt;
  </code></pre>
  
  <p>The spinner will get centered in the containing div and not the targetted div. Is there a way around this?</p>