0

タブのヘッダーのみにスタイルを追加しようとしています。私の目標は、ユーザーがタブを変更するまでイベント ホバーに表示されるクラスを維持することです。私はこのようにしてみました

$("#menuContainer").tabs();
$("#menuContainer").bind('tabsselect',function (event,ui){

    $(this).addClass("ui-state-hover");
});

しかし、それを行うと、すべてのタブの背景が変更され、すべてのdivではなくヘッダーを変更したいだけです。

御時間ありがとうございます。

アップデート

私のhtml

<div id="menuContainer">
        <ul id="menuPrincipal">
            <li>
            <a href="#tabs-1">Quienes Somos</a>
            </li>
            <li>
            <a href="#tabs-2">Catalogo de Repuestos</a>
            </li>
            <li>
            <a href="#tabs-3">Cotizacion OnLine</a>
            </li>
            <li>
            <a href="#tabs-4">Preguntas Frecuentes</a>
            </li>
        </ul>
</div>
4

2 に答える 2

0

編集：正しい子のチェックに正しいトラバースを適用する：

$("#menuContainer").find("a").each(function(){
    $(this).hover(
        function(){$(this).addClass("ui-state-hover");},
        function(){$(this).removeClass("ui-state-hover");}
    );
});

http://jsfiddle.net/myriad/EEW2m/でモックアップをテストします

于 2011-06-26T03:12:01.047 に答える
0

最後に、適切なイベントを添付し、このような正しいオブジェクトを使用する必要があるタブのスタイルを変更することができました

$("#menuContainer").bind('tabsshow',function (event,ui){
    $(ui.tab).parent().removeClass('ui-state-active');
    $(ui.tab).parent().css('border','1px solid #072fc5');

});

ui-state-activeスタイルを追加するためにクラスを削除することに注意してください

tabsshowまた、クラス ui-state-activeイベントでtabselectedはまだタブに追加されていないため、イベント アソシエイトが重要です。

于 2011-06-26T20:29:08.713 に答える