UI tab rotate steal focus

Question

I'm using jquery ui tab and using rotate in slideshow.

<ul class="ui-tabs-nav" id="slide-controls">
        <li class="ui-tabs-selected" id="slide-control-slide_1"><a class="selected" href="#slide_1">Slide 1</a></li>
        <li id="slide-control-slide_2"><a href="#slide_2">Slide 2</a></li>
        <li id="slide-control-slide_3"><a href="#slide_3">Slide 3</a></li>
        <li id="slide-control-slide_4"><a href="#slide_4">Slide 4</a></li>
</ul>

Q1) My slideshow is at the top, while my page is pretty long. So everytime when I scroll down to the bottom of my page, and when the slideshow change slide (auto rotate), the focus will land on the anchor tag above. So looks like the jquery ui tab rotate steal my focus. Any help would be appreciated.

Q2) Another question - how can I stop an element from focusing? (somehow related to my previous quesion )

Thanks

Answer 1

You need to set a height on your slideshow. Here's a solution to your answer JQuery UI Tabs Causing Screen to "Jump"