jquery - jQuery if/else レイヤーを表示/非表示

Question

Edge Animate でレスポンシブ Web サイトのスライド バーを作成しています。1 つのスライドに対して 2 つのスライドを作成しました (責任を持って調整できるようにするため)。ウィンドウの幅が 786px 未満の場合は 2 番目のスライドを表示し、それを超える場合は最初のスライドを表示します。これは私が使用したコードです：

var n = $(window).width();
if (n > 768) {
    // Show an Element.
    //  (sym.$("name") resolves an Edge Animate element name to a DOM
    //  element that can be used with jQuery)
    sym.$("#panel_01_photo").show();
    // Hide an Element.
    //  (sym.$("name") resolves an Edge Animate element name to a DOM
    //  element that can be used with jQuery)
    sym.$("#panel_02_photo").hide();
}
else {
    // Show an Element.
    //  (sym.$("name") resolves an Edge Animate element name to a DOM
    //  element that can be used with jQuery)
    sym.$("#panel_02_photo").show();
    // Hide an Element.
    //  (sym.$("name") resolves an Edge Animate element name to a DOM
    //  element that can be used with jQuery)
    sym.$("#panel_01_photo").hide();
}

何らかの理由で機能しません。助けてくれてありがとう。

Answer 1

$(window).on('resize', function() {
    var n = $(window).width();
    sym.$("#panel_01_photo").toggle(n > 768);
    sym.$("#panel_02_photo").toggle(n < 768);
});