4

わかりました、これが取引です。http://jqueryui.com/tabs/#mouseoverからjQueryタブをインストールしました

ただし、最初の2つのタブでのみ正常に機能しているように見えます。タブ3、4、...をアクティブにすると、各divの前に空白が追加されるため、すべてのdivが約10px下に移動します。

私のスクリプトは大したことではありません：

jQuery：

$(document).ready(function() {
    $( "#tabs" ).tabs({
        event: "mouseover"
        });
});

HTML：

  <div id="tabs">

    <ul class="tabs">
      <li><a href="#tab-1">1</a></li>
      <li><a href="#tab-2">2</a></li>
      <li><a href="#tab-3">3</a></li>
      <li><a href="#tab-4">4</a></li>
      <li><a href="#tab-5">5</a></li>
      <li><a href="#tab-6">6</a></li>    
    </ul>

    <div id="1"></div>
    <div id="2"></div>    
    <div id="3"></div>
    <div id="4"></div>
    <div id="5"></div>
    <div id="6"></div>

  </div>
4

1 に答える 1

3

問題は、各 div を閉じることです。余分なbrがあります。

</div> <br /> 
         ^
         ^
         ^ 
       (remove this br) 

       <div id="tab-n".....>
          // something
       </div>
于 2012-12-17T00:06:56.107 に答える