0

ウィンドウの幅を検出し、画面が と の間にある場合にサブ ナビゲーション リストの項目を調整する小さなスクリプトが600pxあり1200pxます。スクリプトは制約内で機能しますが、ブラウザが を超えて1200pxまたはそれ以下にサイズ変更された場合600px、幅の宣言は関連する各リスト項目に適用されたままになります。ただし、ページが更新されると、幅は本来あるべきものになります。初めてのポスターですので、何が欠けているか教えてください。

ありがとう

$(window).resize(function() {
var sub_menu_list_item = $('.current-menu-item .sub-menu li');
var sub_menu_list_item_count = sub_menu_list_item.length;
var divisor = ( 1 / sub_menu_list_item_count );
var width = divisor * 100;
var ww = $(window).width();

if ( ww > 600 && ww < 1200 ){
    if ( sub_menu_list_item_count % sub_menu_list_item_count === 0 ){
        sub_menu_list_item.css('width',  width + '%' );
    } 
}

});

4

2 に答える 2

0

不要な画面サイズの制約を削除する必要があります

if ( ww > 600 && ww < 1200 ){
    if ( sub_menu_list_item_count % sub_menu_list_item_count === 0 ){
        sub_menu_list_item.css('width',  width + '%' );
    } 
    else {
        sub_menu_list_item.css('width',  'auto' );
   }
}
于 2015-03-09T18:23:39.963 に答える
0

width「else」の場合、サブアイテムにスタイルを適用していないようです。つまり、ウィンドウ幅が より小さい600pxか大きい場合1200pxです。したがって、ウィンドウが幅の制限内にある間にサイズが変更されたアイテムは600px、1200pxページが更新されるまでそのままになります。

デフォルトのケースを思いついた場合は、本体widthで行ったのと同じようにスタイルを設定できます。if

$(window).resize(function() {
    var sub_menu_list_item = $('.current-menu-item .sub-menu li');
    var sub_menu_list_item_count = sub_menu_list_item.length;
    var divisor = ( 1 / sub_menu_list_item_count );
    var width = divisor * 100;
    var ww = $(window).width();

    if ( ww > 600 && ww < 1200 ){
        if ( sub_menu_list_item_count % sub_menu_list_item_count === 0 ){
            sub_menu_list_item.css('width',  width + '%' );
        } 
    } else {
        sub_menu_list_item.css('width',  'auto' );
    }
});
于 2015-03-09T18:23:41.263 に答える