2013-05-02 90 views
0

我有一個代碼equalHeight。將柱子設置爲相同的高度。但我用窗口調整大小。該腳本僅適用於臺式機和平板電腦,不適用於移動設備。我有這個劇本。這個腳本正在工作,但我怎樣才能使這個腳本更好?因爲我現在使用了兩次相同的功能。equalHeight調整響應的大小

我該如何做得更好?

var viewportWidth = $(window).width(); 
if ((viewportWidth >= 760)) { 
    setTimeout(function() { 
     equalHeight($('#footer .column')); 
    }, 250); 
}; 
$(window).resize(function() { 
    var viewportWidth = $(window).width(); 
    if ((viewportWidth >= 760)) { 
     setTimeout(function() { 
      equalHeight($('#footer .column')); 
     }, 250); 
    }; 
}); 
+0

你不能用c SS? – 2013-05-02 07:37:09

回答

1

您可以自定義一個函數並調用它,只要你需要:

function changeWidth() { 
    var viewportWidth = $(window).width(); 
    if ((viewportWidth >= 760)) { 
     setTimeout(function() { 
      equalHeight($('#footer .column')); 
     }, 250); 
    }; 
} 

$(document).ready(function() { 
    changeWidth(); 
    $(window).resize(function() { 
     changeWidth(); 
    }); 
}); 
0

您可以通過觸發resize事件這樣避免重複:

$(window).resize(function() { 
    var viewportWidth = $(window).width(); 
    if ((viewportWidth >= 760)) { 
     setTimeout(function() { 
      equalHeight($('#footer .column')); 
     }, 250); 
    }; 
}) 
.trigger('resize'); 
0

嘗試這種方式

$(document).ready(function() { 
    resizeFunction(); 

    $(window).resize(function() { 
     resizeFunction(); 
    }); 
}); 

var resizeFunction = new function() { 
    var viewportWidth = $(window).width(); 
    if ((viewportWidth >= 760)) { 
     setTimeout(function() { 
      equalHeight($('#footer .column')); 
     }, 250); 
    }; 
} 
+0

頁面首次加載時也需要調用它。 – 2013-05-02 16:17:31

+0

@MattCoughlin:更新!謝謝 – asifsid88 2013-05-03 04:35:44