0

基本的に私の例を見ると、リンクをクリックするとトグルが開始され、別のリンクをクリックすると次のパネルがトグルされます。

私の問題は、実際には、アイコンにスプライトを使用することを計画していることです。バックグラウンド位置を正しい位置に差し引くには、トグルをアクティブにしてリンクに「アクティブ」クラスを適用する必要があります。クリックしたリンクにクラスを適用しているだけなので、私の例ではすべて間違っていると思います。私が望む方法でそれを適用する方法、または実際にそれが可能かどうかはわかりません。

私のコードは次のとおりです。

http://jsfiddle.net/visualdecree/4A23Z/5/

4

2 に答える 2

1

うまくいけば、私は問題を理解しています...

http://jsfiddle.net/4A23Z/8/

アクティブなメニュー項目を強調するためにスタイリングを入れました。アクティブなLIを切り替える前に、LI上のすべてのアクティブなクラスを削除するコードを追加しました。

ul.sidenav li.active { background:cyan; }

 $('.sn').click(function(){
    $('ul.sidenav li').removeClass('active');                 
    $(this).stop(true,true).toggleClass("active");
});​

編集：

http://jsfiddle.net/4A23Z/10/

$('.sn').click(function(){
    $('ul.sidenav li').removeClass('active');                    
    $(this).stop(true,true).addClass("active");
});
于 2012-09-05T15:34:16.480 に答える
0

私があなたを正しく理解していれば、このjsfiddle （またはアクティブなクラスが定義されたこれ）を試してください

$(".sn a").on('click',function(){
    var panID = $("#" + $(this).data('panel') );
    $("div[id*='sn-pan-']").hide({slide:'toggle'}, 1000);
    var link = this;
    $(panID).css("left","100px").animate({width:'toggle'}, 500, function()                      { 
        $(".sn a").removeClass("active");
        $(link).toggleClass("active");
    })
})

 ​
于 2012-09-05T15:30:34.267 に答える