2017-08-07 11 views
0

var screenWidthを変更しようとしています。ウィンドウをモバイルにリサイズするとき。読み込んだときに機能しますが、サイズを変更するときには機能しません。私はここで何が欠けていますか?私はjssorスライダーを使用しています。私はscreenWidthFunction()が動作していることをコンソールで見ることができます。Javascript - JSSORで動作しないリサイズの変数を変更するSlider

JS:

var screenWidth; 

    function screenWidthFunction() { 

     if($(window).innerWidth() < 768) {    
      screenWidth = 960; 
      console.log(screenWidth); 
     } else { 
      screenWidth = 1920; 
      console.log(screenWidth); 
     } 

    } 

    //var screenWidth = 1920; 

    screenWidthFunction(); 

    function ScaleSlider_home_1() { 
     var refSize_home_1 = jssor_home_1_slider.$Elmt.parentNode.clientWidth; 
     if (refSize_home_1) { 
      refSize_home_1 = Math.min(refSize_home_1, screenWidth); 
      jssor_home_1_slider.$ScaleWidth(refSize_home_1); 
     } 
     else { 
      window.setTimeout(ScaleSlider_home_1, 30); 
     } 
    } 
    ScaleSlider_home_1(); 

    $(window).bind('load',function(){ 
     //screenWidthFunction(); 
     ScaleSlider_home_1(); 
    });    

    $(window).bind('resize',function(){ 
     screenWidthFunction(); 
     ScaleSlider_home_1(); 
    });    

    $(window).bind('orientationchange',function(){ 
     //screenWidthFunction(); 
     ScaleSlider_home_1(); 
    }); 

私のバイオリンです:http://jsfiddle.net/df58scsk/1/

+0

あなたのHTMLとCSS – ewwink

+0

はこちらをご覧下さい示しています: '<768' –

+0

それは全幅でリサイズ - )...画面のサイズがブレークポイントよりも小さい場合に、あなたがそれを再実行した場合の例で見ることができます...あなたは全幅を取得しますが、ブレークポイントを超えてサイズを変更すると、自動的に全幅を取得する...私も持っていると思います。私の説明があまりにも混乱しないことを願って... – ewwink

答えて

0

あなたはこの

$(window).resize(function() { 
    screenWidthFunction(); 
    ScaleSlider_home_1(); 
}); 

を試すことができますが、イベント

+0

残念ながら違いはありません。 JSSORは何らかの理由で変数の変更を無視しています... –

+0

私はあなたのコードをチェックするためにそれのためにフィドルを設定できますか? –

+0

ここをクリックしてください:jsfiddle.net/df58scsk/1 –

0

をバインドする必要はありませんあなたがの1が必要な場合があります以下の例、

https://github.com/jssor/slider/blob/master/examples/full-window-contain-mode.html https://github.com/jssor/slider/blob/master/examples/full-window-cover-mode.html

そして、我々は数日中にバージョン25.3.0を公開しますが、それは、モバイルデバイスをターゲットとフルウィンドウ-フレックスmode.htmlが付属しています。

関連する問題