ウィンドウのサイズが変更されたときのスライダの幅と高さのサイズ変更

Question

ブラウザウィンドウのサイズを変更すると動的にサイズ変更されるWebサイトを作成しています。これは、CSSのパーセンテージを使用して達成されます。しかし、ブラウザウィンドウのサイズが変更されたときに、アコーデオンスライダのサイズを変更する必要があります。これは、CSSを使用して行うことはできないと思います。私はこれを解決する最善の方法はjQueryを使うことだと考えていますが、どうやってそれをやっていくのか分かりません。ウィンドウのサイズを変更すると、スライダーの高さと幅をどのように変更できますか？どんな助けもありがとう。ページは次の場所にあり

：あなたのKwicksのjqueryのコードを見ずに[リンク削除]

Answer 1

良い答えを出すのは難しいですが、私が言うことができるものから、あなたの最善の策は、現在のウィンドウサイズを計算することですあなたのKwicksのアコーディアンの "最小"サイズを設定し、それに応じてそれをリフレッシュしてください。

編集：より多くの情報ghostpool、これらの線に沿って何か

//after acknowledging window size change 
var minsize = applicableAccordianWidth/numberOfElements; 
$('.kwicks').kwicks({ 
    min: minsize, 
    spacing: 5 
}); 

のためにあなたがkwicksコンテナを再初期化することができるはず、とで割った要素の大きさに基づいて分サイズのためのオプションを送信アコーディオンの要素の数

Answer 2

正確なアプローチは、スライダに使用しているプラ​​グインによって異なりますが、関数をresizeイベントに追加することから始めたいと思うでしょう。ここではその上でいくつかのドキュメントがあります：http://api.jquery.com/resize/

そして例：

$(function() { 
    $(window).resize(function() { 
     //do your resizing stuff here 
     alert('You resized me!'); 
    }); 
}); 

Answer 3

次のコードは、リサイズ

(function ($){ 
    $(window).resize(function(){ 
    var w = $('#kwicks').width(); 
    var eachw = (w/5.0); 
console.log(w,eachw); 
    $('.kwick').css('width',eachw+'px').css('left',function(idx){return idx*eachw}); 
    }); 
})(jQuery); 

のために収容されますが、あなたはまた、新しい値を使用するようにプラグインを指示する必要がありますアニメーション化するときに、私は彼らがこれをサポートするかどうかわかりません。