wordpress - CarouFREDSel プラグイン: メディア クエリによって、カルーセル内のサイズ変更可能な画像がトリガーされました

Question

このカルーセルは、次のような wordpress プラグインとして用意されています (ブラウザ ウィンドウの全幅):

ブラウザー ウィンドウのサイズを変更すると、メディア クエリがトリガーされるまで画像のサイズは同じです。

@media screen and (min-width: 1470px) {
    #image-carousel { height: 500px; }
    #carousel-images img { width: 980px; height: 500px; }

    #prev, #next { height: 500px; }
    #prev { left: -490px; }
    #next { right: -490px; }
}

@media screen and (min-width: 500px) and (max-width: 1470px) {
    #image-carousel { height: 383px; }
    #carousel-images img { width: 750px; height: 383px; }

    #prev, #next { height: 383px; }
    #prev { left: -375px; }    
    #next { right: -375px; }
}

次に、サイズ変更が必要な div のサイズを変更すると、画像は正しく縮小されますが、これが発生します 。画像は「中心からずれています」。カルーセルの作成で発生する一部のプロセスは (当然のことながら) トリガーされません。私が今これを解決した方法は次のとおりです:(javascriptがDRYではないことはわかっています。これは単なる例です)

onCreate: function (data) {
    $(window).resize( function () {
        if( $(window).width() > 1470 ) {
            $(".dev7-caroufredsel-carousel").carouFredSel({
                // Create the carousel again...    
            });
        } else if ( $(window).width() <= 1470 ) {
            $(".dev7-caroufredsel-carousel").carouFredSel({
                // Create the carousel again...    
            });
        }
    });
}

カルーセルのonCreateイベントでは、サイズ変更イベントをバインドしてwindow、ブラウザー ウィンドウが指定された制限を超えたときにカルーセルを再作成しました。これは機能しますが、問題はないと思いますが...

これは適切な方法ではなく、悪いことのように思えます。これを適切に行うにはどうすればよいでしょうか?