2

私は自分が抱えているレイアウトの問題をトラブルシューティングするのに苦労しており、いくつかの洞察を得ることを望んでいました。

左側には開閉するメニューパネルがあり、右側にはレスポンシブモードに設定されているガレリアがあります。これはウィンドウサイズが変更されるとサイズが変更されることを意味します。

私が達成しようとしている目標は、メニューパネルが折りたたまれたときに、レスポンシブなGalleriaのサイズを変更したり、その逆を行ったりすることです。

現在、パネルが折りたたまれた位置から始まり、展開されている場合、ドキュメントの幅はメニューパネルの幅だけ増加し、ガレリアのサイズは変更されません。ここから、ブラウザのサイズを1ピクセルでも手動で変更すると、レイアウトが更新され、すべてが正常になります。

そこで、ビューポートが変更されたかのようにガレリアが反応するように、実際にサイズを変更せずに、ビューポートを更新する方法を探し始めました。以下は、メニューを切り替えるためのコードです。ドキュメントサイズを元のサイズに強制しようとしていますが、これでも結果が得られません。

助けてくれてありがとう

var documentWidth = $(document).width();
    var documentHeight = $(document).height();
    function hideMenu() {
        $('#User_Menu').hide("slide", { direction: "left" }, 1000, function () {
            showOpenMenu();
            $.cookie('pj-userMenuTab', 'block')
            $(document).width(documentWidth);
        });
    }
    function showOpenMenu() {
        $('#Open_User_Menu').show("slide", { direction: "left" }, 500);
        $.cookie('pj-userMenu', 'none')
    }
    function showMenu() {
        $('#Open_User_Menu').hide("slide", { direction: "left" }, 500, function () {
            hideOpenMenu();
            $.cookie('pj-userMenu', 'block');
        });
    }
    function hideOpenMenu() {
        $('#User_Menu').show("slide", { direction: "left" }, 1000);
        $.cookie('pj-userMenuTab', 'none')
        alert('...' + documentWidth);
        $(document).width(documentWidth);
        alert($(document).width());
    }
4

1 に答える 1

5

コメントによると、必要だったresizeのは、Galleriaプラグインのサイズが変更されるようにイベントをトリガーすることでした。

次のコード（open / close関数に追加された場合）は機能するはずです。

$(window).trigger("resize");
于 2012-07-27T08:24:08.553 に答える