0

特定のリンクをクリックできるようにしたいのですが、これによりサイドバーが非表示に<section>なり、コンテンツのサイズが変更されます<section>。現在、隠し機構は機能していますが、サイズ変更の部分で苦労しています。

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

$(document).ready(function() {
        $('#sidebar-toggle-link').click(function() {
                $('#container-sidebar').toggle('slide');
        });
});

私はこれを2番目の関数内に追加しようとしました：

var toggle_width = $('#container-content').width() == 100 ? '74%' : '100%';
$('#container-content').animate({ width: toggle_width });

ただし、これによりコンテンツは100％<section>に拡大縮小されますが、リンクを2回クリックしても元に戻ることはありません。サイドバーは再び表示されますが、コンテンツ<section>はサイドバーの下にシフトされ、100％のサイズのままです。

JQueryでこれを行うにはどうすればよいですか？

4

1 に答える 1

0

代わりにこれを試してください：

var toggle_width = $('#container-content').width() == $(window).width() ? '74%' : '100%';

ウィンドウまたは幅が100％の親がターゲットになっています。

要素に適用されるスタイル（パディング、マージンなど）に応じて、これも試すことができます

$('#container-content').outerWidth() == ...
于 2012-12-06T17:57:43.060 に答える