title: bxslider accessibility tabbing distorts slide alignment
body: <p>I'm using bxslider and have created 2 jsfiddles that show my problem.</p>
  
  <p>We were have accessibility issues so I've upgraded the library to 4.2.3 which has better support</p>
  
  <p>This is an example of bxslider and you can tab through the controls and everything is fine</p>
  
  <p><a href="http://jsfiddle.net/qax7w8vt/2/embedded/result/" rel="nofollow noreferrer">http://jsfiddle.net/qax7w8vt/2/embedded/result/</a></p>
  
  <p>The problem comes when there's a focusable element in one of the slides and when you tab through the content the slider alignment is distorted and never really recovers</p>
  
  <p><a href="http://jsfiddle.net/qax7w8vt/1/embedded/result/" rel="nofollow noreferrer">http://jsfiddle.net/qax7w8vt/1/embedded/result/</a></p>
  
  <p><img src="https://i.stack.imgur.com/LmvYB.png" alt="enter image description here"></p>
  
  <p>Possible solutions...</p>
  
  <ol>
  <li>tabindex=-1 on the "a" element but problem is that can't ever tab to the link</li>
  <li>Listen out to a slide transition and somehow re-align the slider</li>
  </ol>
  
  <p>I couldn't find a bug for this listed in their issue list so does anyone have a suggestion on how to handle this?</p>
  
  <p>Better to check the fiddle but here's part of the source</p>
  
  <pre><code>&lt;div style="width: 730px; position: relative; margin: 0 auto;"&gt;
      &lt;ul class="bxslider"&gt;
          &lt;li&gt;
              &lt;img src="http://bxslider.com/images/730_200/tree_root.jpg" title="Funky roots" /&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;a href="http://google.com" style="position: absolute;left:200px; bottom:40px;"&gt;Some link here&lt;/a&gt;
              &lt;img src="http://bxslider.com/images/730_200/hill_road.jpg" title="The long and winding road" /&gt;
          &lt;/li&gt;
          &lt;li&gt;
              &lt;img src="http://bxslider.com/images/730_200/trees.jpg" title="Happy trees" /&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <hr>
  
  <pre><code>    $(document).ready(function () {
          $('.bxslider').bxSlider({
              slideWidth: 730,
              mode: 'horizontal',
          });
      });
  </code></pre>