TAB打破元素位置

Question

我在这里做的jsfiddle例如： http://jsfiddle.net/FE55W/

HTML：

<div class="wrapper"> 
    <div class="slider"> 
     <div class="slide n1"><a href="#">test</a></div> 
     <div class="slide n2"><a href="#">test</a></div> 
    </div> 
</div> 

CSS：

.wrapper{ 
    width:500px; 
    height:350px; 
    margin:0 auto; 
    position:relative; 
    overflow:hidden; 
} 
.slider{ 
    width:5000px; 
    position:absolute; 
    left:0; 
    top:0; 
} 
.slide{ 
    width:500px; 
    height: 350px; 
    float: left; 
} 
.slide.n1{ 
    background-color: green; 
} 
.slide.n2{ 
    background-color: blue; 
} 

问题是，当你点击带有绿色的方形鼠标推TAB几次，出现蓝色方块并打破元素位置。我能如何解决这个问题？

Answer 1

将tabindex="-1"添加到您不想标签的锚点。

<div class="slide n2"><a tabindex="-1" href="#">test</a></div> 

http://jsfiddle.net/Morlock0821/FE55W/1/