如何做響應SVG和文本並排？

Question

我試圖創建一個包含一個方形SVG標誌和一個名稱，並排，將很好地調整瀏覽器窗口的標題。

我在頭文件中有＃個DOG和#name。我在#name上使用了jQuery FitText，併爲#logo編寫了一個簡單的腳本來從#name獲取高度，並將其用於高度和寬度。相關位的位置：http://jsfiddle.net/dBcdz/

<header> 
    <div id="name">MY NAME</div> 
    <div id="logo"></div> 
    <div style="clear:both"></div> 
</header> 

$(document).ready(function() { 
    var setLogo = new function() { 
     var $size = $('#name').height(); 
     $('#logo').css({ 
      'height': $size, 
      'width': $size 
     }); 
    } 
}); 
$(window).resize(function() { 
    setLogo(); 
}); 

的問題是，我不能讓這兩個的div對窗口進行調整。最好只有名稱調整大小，否則我必須重新加載頁面才能看起來正確。誰能幫忙？

Answer 1

你幾乎在那裏，我緩存選擇這樣它的效率更高：

var $name = $("#name"), 
    $logo = $('#logo'); 

function resize() { 
    var $size = $name.fitText().height(); 
    $logo.css({ 
    'height': $size, 
    'width': $size 
    }); 
} 

$(document).ready(resize); 
$(window).resize(resize); 

http://jsfiddle.net/aXWZC/

Answer 2

這解決您的代碼：

SEE DEMO

function setLogo() { 
    var $size = $('#name').height(); 
    $('#logo').css({ 
     'height': $size, 
      'width': $size 
    }); 
} 

$(document).ready(function() { 
    $(window).resize(function() { 
     $("#name").fitText(); 
     setLogo(); 
    }).resize(); 
});