1

{exp：channel：entries}ペアを使用してTwitterBootstrapのタブを実装する際に問題が発生しました。これは、ブートストラップがロード時にどのタブが表示されるかを知るために、最初のアクティブなタブに.activeクラスを適用することによって指定する必要があるという事実と関係があります。しかし、私のコードは次のとおりです

       <div class="tabbable">
      <ul class="nav navtabs thumbnails">
        {exp:channel:entries channel="member_profiles" limit="4"}
        <li class="active">
          <a class="thumbnail" href="#{member_first_name}-{member_last_name}-tab" data-toggle="tab">
            <img src="{site_url}-/img/240x232.gif" alt="">
          </a>
          <div class="caption">
            <h4>{member_first_name} {member_last_name}</h4>
          </div>
        </li>
        {/exp:channel:entries}
      </ul>
    </div>
  </div>

    <div class="tab-content">
      {exp:channel:entries channel="member_profiles" limit="4" dynamic="no"}
          <div id="{member_first_name}-{member_last_name}-tab" class="tab-pane active">
            <div class="span6">
              <img class="thumbnail" src="{site_url}-/img/250x321.gif" alt="">
            </div>
      {/exp:channel:entries}
    </div>

私が頭を悩ませているように思えない問題領域は、すべてのチャネルエントリにクラスが適用されてclass="tab-pane active row people-profile">いるため、すべてのタブがページに表示されていることです。私は無駄に.active追加しようとしました。{switch="active|||"}また、ここ{if count == 1}active{/if}からの答えは望ましい結果を達成していません。

よろしくお願いします。

4

1 に答える 1

0

まあ、{switch}条件付きチェックの両方が機能するcountはずです。私は条件付きで行きます。

... {if count == "1"} class="active"{/if} ...

または：

... class="tab-pane{if count == "1"} active{/if}" ...

「目的の結果が得られない」と言うときは、マークアップで何が生成されるかを知るのに役立ちます。

于 2012-10-14T18:53:16.100 に答える