javascript - ウィンドウのサイズ変更時に Javascript を変更する

Question

ここに最初の投稿; 見落としのある情報をお詫びします。私はJavascriptの完全な初心者なので、上級者でもお詫びします。

現在、スライダー付きのレスポンシブ Web サイトを作成しています。

スライダーは、より大きなデバイスではサイトの背景全体を占めますが、ウィンドウが 480px 未満の場合、スライダーをより小さな領域に縮小したいと考えています。デバイスが最初にページをロードするタイミングに関して、これは正しく機能しています。正しいスライダー設定が使用されています。

しかし、私が望むのは、ユーザーが Web サイトを 480px 未満にスケーリングすると、その時点で JavaScript が (CSS メディア クエリのように) 新しいスライダー設定を使用するように変更されることです。現時点では、しきい値を下回ったり上回ったりする場合は、ページを更新して新しいスライダー設定を取得する必要があります。

これは、サイトで尋ねられた他の質問から見つけたコードですが、ウィンドウのサイズが変更されたときに変更が発生することはなく、更新時にのみ発生します。

<script>
$(document).ready(function(){

if($(window).width()>480){
$(".slideshow").startslider({
    slideTransitionSpeed: 500,
    slideTransitionEasing: "easeOutExpo",
    sliderFullscreen: true,
    sliderAutoPlay: false,
    sliderResizable: true,
    slidesDraggable: false,
    slideImageScaleMode: "fill",
    showTimer: false,
    showPause: false,
    showDots: false
    });
return;
} else {

$(".slideshow").startslider({
    slideTransitionSpeed: 500,
    slideTransitionEasing: "easeOutExpo",
    sliderFullscreen: false,
    sliderAutoPlay: false,
    sliderResizable: true,
    slidesDraggable: true,
    slideImageScaleMode: "fill",
    showTimer: false,
    showPause: false,
    showDots: false
    });
}
});
</script>

私は Javascript にまったく慣れていないので、これは単純な問題かもしれません。しかし、それはすべて同じように私を超えています。