2017-01-27 34 views
-2

我試圖確定引導程序容器在頁面加載和瀏覽器大小調整時左邊距的數量。javascript - 基於函數調用的不同結果

JS:

$(function() { 
    var margin = parseInt($('.container').first().css('margin-left'), 10); 
}); 

$(window).resize(function() { 
    var margin = parseInt($('.container').first().css('margin-left'), 10); 
}); 

HTML:

<div class="container"> 
    <div class="row"> 
     <div class="col-sm-9 main"> 
      <div class="content text-center"> 
       <h1>MAIN CONTENT</h1> 
      </div> 
     </div> 

     <div class="col-sm-3 sidebar"> 
      <div class="content text-center"> 
       <h1>SIDEBAR</h1> 
      </div> 
     </div> 
    </div> 
</div> 

我的問題是,當它運行在頁面加載時,邊距值約爲10px的大於它的窗口大小調整。

例如:我加載頁面,頁邊空白變量的計算結果爲233.當我調整大小時,無論指向哪一個我調整大小,它立即計算爲225。任何想法這是什麼時候執行的JavaScript在兩種情況下是相同的?

+0

嗨!任何方式我們可以看到這個生活,或在一個codepen?現在,很難弄清楚可能會發生什麼...... – MacPrawn

回答

1

我認爲這是因爲你的第一個電話等待頁面加載,第二個是直接評估。

看看這個例子:http://codepen.io/anon/pen/GrOWoZ?editors=0011

當您纏繞用jQuery這樣的函數$(function(){ /* code */ })

JQuery的等待文件準備就緒。 https://api.jquery.com/ready/ $(function() { // Handler for .ready() called. });

當您直接綁定事件時,它不會等待文檔準備就緒。

我希望這個幫助!

+0

謝謝你,看起來像調用document.ready時的邊距是相同的,並且在你的例子中調整大小。任何想法在我的方面可能會發生什麼變化? – noclist

+0

我認爲你需要在'$(function(){ // Handler for .ready()called。 });' 中包含事件處理函數。換句話說,等待頁面被加載文檔.ready在window.onload上 – Julien

相關問題