javascript - 事前に知らずに、div の背景画像の高さと幅を設定する

Question

jQueryを使用：

背景画像を div に追加するときは常に、背景画像の幅と高さを事前に把握しておく必要があります。

例えば

$("#id-of-some-div").css(
{
   backgroundImage: 'url(' + backgroundImageUrl + ')',
   height: 200,
   width: 450,
   position: 'absolute',
   top: 20,
   left: 20
});

次のコードを使用するだけで、画像のサイズを取得できますか。

以下をテストしましたが、機能していません。$.load 関数内で return ステートメントを使用できないためですか? - return ステートメントは常に同期する必要があると思いますよね?

例えば

var bgImageUrl = "/*insert image url*/";

var backgroundImageHeightAndWidth = function(backgroundImageUrl)
{
   var backgroundImageSize = [];
   var backgroundImage = new Image();
   backgroundImage.src = backgroundImageUrl;
   backgroundImage.id = "background-image-id";
   $("#background-image-id").load(function ()
   {
      backgroundImageSize.push($("#background-image-id").height());
      backgroundImageSize.push($("#background-image-id").width());
      return backgroundImageSize;   
   });
};
var backgroundImageHeightAndWidthArray = backgroundImageHeightAndWidth();
var backgroundImageHeight = backgroundImageHeightAndWidthArray[0];
var backgroundImageWidth = backgroundImageHeightAndWidthArray[1];

$("#id-of-some-div").css(
{
   backgroundImage: 'url(' + backgroundImageUrl + ')',
   height: backgroundImageHeight,
   width: backgroundImageWidth,
   position: 'absolute',
   top: 20,
   left: 20
});