0

メニューのウィンドウの幅に応じて、アイコンの数、たとえば50pxを計算したいと思います。だから私は始めました： 

$(window).width();

ドキュメントレディ機能を使用してページをロードしている間、幅が指定されます。わかった！

次に、ウィンドウのサイズを変更しながら、適切な量のアイコンを計算します。

$(window).resize(function() { //resize just happened, pixels changed });

タスク

  1. ウィンドウの初期幅->ユーザーがウィンドウのサイズを変更していない場合
  2. ウィンドウの可変幅->ユーザーがウィンドウのサイズを変更する場合

各タスクは実行されていますが、まとめられていません。

手伝ってもらえますか->THX!!

ウィンドウの初期幅とウィンドウのサイズ変更中にアイコンの数を計算するにはどうすればよいですか？

私のスタート：

var activeItemcount; 

                checkWidth();
                $(window).resize(checkWidth);

                   function checkWidth() {
                        windowSize = $(window).width();
                      //   console.log(windowSize); 

                        var activeItemWidth = '100';                            // width of the icons
                        var maxWidth = windowSize;                              // max div width on screen 
                        activeItemcount = maxWidth / activeItemWidth;           // max icon with actual screen width
                        activeItemcount = Math.round(activeItemcount) -1;       // calculation
                           console.log(activeItemcount);


                   var i = '0'; 

                     $('.platform-view').each(function(){
                            if(i < activeItemcount ){
                            $(this).wrapAll('<div class="iconview-1"  />');
                            i++;
                            }else{  
                                $(this).wrapAll('<div class="iconview-2" />');

                            }




                    });


                   };
4

2 に答える 2

1

はっきりとはわかりませんでした。ただし、このコードは、サイズ変更中にウィンドウの可変幅を返します。

Jquery：$（window）.resize（function（）{

$('#log').append('<div>'+$(window).width()+'</div>');

}）;

HTML：

例： コードのサンプル

于 2012-12-31T09:31:52.047 に答える
0

計算を独自の関数に配置します。

function calculateIcons()
{
    var viewport = { width: $(window).width(), height: $(window).height() };
    // Do cool things with viewport.width
}

そして、resize次のように、この関数をDOMReadyとjQueryの関数にバインドするだけです。

$(calculateIcons);
$(window).resize(calculateIcons);
于 2012-12-31T09:26:19.903 に答える