Sie müssen die Registerkarten auf der Seite behalten - immer auf der Vorderseite der Seite

Question

Sie müssen die Registerkarten auf der Seite behalten - immer auf der Vorderseite der Seite. Wenn Sie auf den einen, zwei klicken, ist es in Ordnung, aber wenn Sie auf Drei klicken, kommt der Seiten-Scrolling über die Registerkarten. Wie kann ich die Tabs an der Vorderseite bitte beibehalten?

Hier ist meine jsfiddle Link http://jsfiddle.net/97tbk/737/

Hier ist der Code

<div id="tabs"> 
    <ul> 
     <li><a href="#fragment-1"><span>One</span></a></li> 
     <li><a href="#fragment-2"><span>Two</span></a></li> 
     <li><a href="#fullpage"><span>Three</span></a></li> 
    </ul> 

    <div id="fragment-1"> 
     <p>First tab is active by default:</p> 
     <pre><code>$("#tabs").tabs(); </code></pre> 
    </div> 

    <div id="fragment-2"> 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
    </div> 

    <div id="fullpage"> 
     <div class="section">One</div> 
     <div class="section"> 
      <div class="slide">Two 1</div> 
      <div class="slide">Two 2</div> 
     </div> 
     <div class="section">Three</div> 
     <div class="section">Four</div> 
    </div> 
</div> 

Answer 1

Sie benötigen einen z-index auf Ihre ungeordnete Liste hinzuzufügen. Versuchen Sie dies:

Ich kann dieses Schnipsel jetzt nicht testen, aber ich bin mir ziemlich sicher, dass es funktioniert.

Answer 2

Sie können hierfür die Eigenschaft "z-index" verwenden. Sie müssen immer mit "position: relative" verwenden oder es wird nicht funktionieren. Hier

#tabs ul { 
    position: relative; 
    z-index: 99; 
} 

ist die Geige: http://jsfiddle.net/97tbk/740/