1

誰かが危険なifステートメントを手伝ってくれませんか？私はそれで何も悪いことが見えないかもしれないので試してみてください、コードはifステートメントの外で動作します：

var sizeBefore;
var sizeAfterResize;
var sizeBreakPoint;
var resizeTimer; 
$(function() {
    sizeBefore = $(window).width();
    sizeBreakPoint = 500;
    doneResizing();       
});

function doneResizing(){
       sizeAfterResize = $(window).width();
       if ((sizeBefore < sizeBreakPoint) && (sizeAfterResize >= sizeBreakPoint)) {
                alert('Before:' + sizeBefore);
                alert('After:' + sizeAfterResize);
                sizeBefore = sizeAfterResize;
                // THIS RUNS WHEN OUTSIDE IF STATEMENT
       }
}


$(window).resize(function() {
    //doneResizing();
     clearTimeout(resizeTimer);
     resizeTimer = setTimeout(doneResizing, 100);
});

編集：このステートメントは、ウィンドウが小さいサイズからsizeBreakPoint大きいサイズにサイズ変更された場合に、ドキュメントの準備ができているか、サイズ変更が完了した場合にのみsizeBreakPoint当てはまります。

編集：ソリューション

var sizeBefore;
var sizeAfterResize;
var sizeBreakPoint;
var resizeTimer; 
$(function() {
    sizeBefore = $(window).width();
    sizeBreakPoint = 500;
    doneResizing();       
});

function doneResizing(){
       sizeAfterResize = $(window).width();
       if ((sizeBefore < sizeBreakPoint) && (sizeAfterResize >= sizeBreakPoint)) {
                alert('Before:' + sizeBefore);
                alert('After:' + sizeAfterResize);
       }
       sizeBefore = sizeAfterResize;
}


$(window).resize(function() {
     clearTimeout(resizeTimer);
     resizeTimer = setTimeout(doneResizing, 100);
});
4

3 に答える 3

1

私が言うことができるならあなたを見てテストすることからOK：

if ((sizeBefore < sizeBreakPoint) && (sizeAfterResize >= sizeBreakPoint))

これは、ウィンドウが500未満で始まり、サイズを変更した後、500を超える場合にのみ当てはまります。これは、サイズを変更することがないためです。

本当に確認したいことを教えてください。またはこれがあなたが本当に欲しいものなら。

**編集：提案された解決策**

このようなことをしてみてください：

$(function() {
   sizeBreakPointMin = 480;
   sizeBreakPointMax = 520;
   doneResizing();       
});

function doneResizing(){
   sizeAfterResize = $(window).width();
   //this way you have a window where this is false and it's as you want to allow the window as in a fine size
   //you can garantie that the window is always bigger then 480 and smaller then 520
   if ((sizeAfterResize < sizeBreakPointMin) || (sizeAfterResize >= sizeBreakPointMax)) {
            alert('Before:' + sizeBefore);
            alert('After:' + sizeAfterResize);
            // THIS RUNS WHEN OUTSIDE IF STATEMENT
   }
}

あなたのコードから：

 if ((sizeBefore < sizeBreakPoint) && (sizeAfterResize >= sizeBreakPoint)) {
            ...
            sizeBefore = sizeAfterResize;
 }

この2つの行はうまくいきません。これは、初めてこれが当てはまる場合sizeAfterResize >= sizeBreakPoint、次に行くときにif sizeBeforeisが常に大きくなることを保証しsizeBreakPoint、ifステートメントをそのまま2回入力できないようにするためです（sizeBeforeifの外では変更しません。

お役に立てれば。

于 2013-03-01T15:34:35.757 に答える
0

あなたの問題はif条件の中にあると思います。 sizeBeforeは、ドキュメント準備完了イベントでの画面幅に関係なく、フルスクリーンブラウザを使用している場合は、500（ブレークポイント値）より大きくなります。ただし、を更新するsizeBeforeことはないため、がより低くなることはありません。sizeBreakPointしたがって、ifステートメントのこの部分が真になることはありません。(sizeBefore < sizeBreakPoint)

于 2013-03-01T15:24:52.190 に答える
0

これは質問に対する直接の答えではなく、レスポンシブに私自身のひねりを加えただけですJavaScript

// calculate viewport width so that we can load js conditionally
function responsive(){
    var scaffolding = 'desktop';
    var w = parseInt($(window).innerWidth(), 10);
    if (w > 0 && w < 768) { scaffolding = 'phone'; }
    if (w >= 768 && w <= 980) { scaffolding = 'tablet'; }
    if (w > 980) { scaffolding = 'desktop'; }
    return scaffolding;
}

if ( responsive() == phone ) {
    // do stuff only on phones
}
if ( responsive() != phone ) {
    // do stuff everywhere else but phones
}

コードの後半で条件の使用を開始するときにまだ意味がある方法で、各ブレークポイントが何を表し、何が呼び出されるかを定義できます。

于 2014-01-21T16:37:52.437 に答える