0

画像を追加する必要があるjQueryタブがあります。

タブオーバー

したがって、タブが選択されると、次のようになります ここに画像の説明を入力

これは、次のコードによって実現されています。

        $(".ui-state-active").css("background-image", "url('/Content/images/tab-over.png')");
        $('#tabs .tab-menu li a').click(function() {
            $('#tabs .tab-menu li').css("background-image", "none");
            $(this).parent().css("background-image", "url('/Content/images/tab-over.png')");
        });

コードの最初の行で、そのクラス ( .ui-state-active ) を削除し、独自のクラスを追加することを期待して、正常に動作します。どうすればそれができますか？これが私のタブコードです：

<ul class="tab-menu">
        <li><a href="<%= Url.Action("GetCoreTab", "Tab") %>" class="a"><b>
            <div id="home" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetCustomerInformationTab", "Tab") %>" class="a"><b>
            <div id="customer-information" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetRatesAndChargesTab", "Tab") %>" class="a"><b>
            <div id="rates-and-charges" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetPaymentsAndVouchersTab", "Tab") %>" class="a"><b>
            <div id="payments-and-vouchers" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetDeliveryAndCollectionTab", "Tab") %>" class="a"><b>
            <div id="delivery-and-collection" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetGeneralTab", "Tab") %>" class="a"><b>
            <div id="general" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetEquipmentAndOtherDriversTab", "Tab") %>" class="a">
            <b>
                <div id="equipment-and-other-drivers" class="menu">
                </div>
            </b></a></li>
        <li><a href="<%= Url.Action("GetCustomerPreferencesTab", "Tab") %>" class="a"><b>
            <div id="customer-preferences" class="menu">
            </div>
        </b></a></li>
        <li><a href="<%= Url.Action("GetCustomerStatisticsTab", "Tab") %>" class="a"><b>
            <div id="customer-statistics" class="menu">
            </div>
        </b></a></li>
    </ul>

どんな助けでも大歓迎です。

ありがとう。

4

1 に答える 1

0

.ui-state-active クラスを上書きし、それに関連付けられているすべてのスタイルを削除することをお勧めします。このクラスは、アクティブ化された要素に追加されるため、スタイルを上書きして削除しても問題ありません。

于 2011-04-05T10:58:36.063 に答える