title: Extract a variable from within a load() function in jQuery for universal usage
body: <p>I have a slideshow module I'm working on, and I'd like to get the width/height of the original image (not the CSS rendered box model after loading) to calculate the width/height of the div necessary to contain it. The width/height  of the surrounding div is set to expand/contract accordingly with the size of the viewport. </p>
  
  <p>Here's my HTML structure, which works fine to get everything:</p>
  
  <pre><code>&lt;div id="listing_detail_photo_slider"&gt;
  
      &lt;div id="listing_detail_photo_slider_strip"&gt;&lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/001.jpg&amp;h=1440" alt="001 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/002.jpg&amp;h=1440" alt="002 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/003.jpg&amp;h=1440" alt="003 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/004.jpg&amp;h=1440" alt="004 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/005.jpg&amp;h=1440" alt="005 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/006.jpg&amp;h=1440" alt="006 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/007.jpg&amp;h=1440" alt="007 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/008.jpg&amp;h=1440" alt="008 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/009.jpg&amp;h=1440" alt="009 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/010.jpg&amp;h=1440" alt="010 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/011.jpg&amp;h=1440" alt="011 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/012.jpg&amp;h=1440" alt="012 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/013.jpg&amp;h=1440" alt="013 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/014.jpg&amp;h=1440" alt="014 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/015.jpg&amp;h=1440" alt="015 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/016.jpg&amp;h=1440" alt="016 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/017.jpg&amp;h=1440" alt="017 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/018.jpg&amp;h=1440" alt="018 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/019.jpg&amp;h=1440" alt="019 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/020.jpg&amp;h=1440" alt="020 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/021.jpg&amp;h=1440" alt="021 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/022.jpg&amp;h=1440" alt="022 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/023.jpg&amp;h=1440" alt="023 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/024.jpg&amp;h=1440" alt="024 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/025.jpg&amp;h=1440" alt="025 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/026.jpg&amp;h=1440" alt="026 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/027.jpg&amp;h=1440" alt="027 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/028.jpg&amp;h=1440" alt="028 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/029.jpg&amp;h=1440" alt="029 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/030.jpg&amp;h=1440" alt="030 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/031.jpg&amp;h=1440" alt="031 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/032.jpg&amp;h=1440" alt="032 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/033.jpg&amp;h=1440" alt="033 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/034.jpg&amp;h=1440" alt="034 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/035.jpg&amp;h=1440" alt="035 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;div class="listing_gallery_thumbnail"&gt;
                  &lt;img src="http://www.djdenner.ca/timthumb.php?src=http://www.djdenner.ca/homes/1/036.jpg&amp;h=1440" alt="036 at 4112 Burkehill Road, Bayridge, West Vancouver" class="scale-with-grid" /&gt;
              &lt;/div&gt;
              &lt;/div&gt;  
  </code></pre>
  
  <p>And here's my javascript code running on latest version of jQuery:</p>
  
  <pre><code>function showlisting_window_resize() {
  // deduct the height of the top bar from the total height of the viewport to get slideshow width. 
  // we want bottom to hit the bottom of screen on first view, until users scroll..
  
  var slideshowh = window.windowh-$('#header_container').height();
  $('#listing_detail_photo_slider').height(slideshowh);
  $('#listing_detail_photo_slider_strip').height(slideshowh);
  
  
  
  var slideshoww = 0; // start at 0, add up all the widths with gaps. 
  $('#listing_detail_photo_slider_strip div').each(function(){
      slideshoww = slideshoww + $(this).width()+5;
      var img = $(this).find('img');
      var pic_real = new Array();
      $("&lt;img/&gt;").attr("src", $(img[0]).attr("src")).load(
          function() {
              pic_real[0] = this.width;   // Note: $(this).width() will not
              pic_real[1] = this.height; // work for in memory images.
  
          }
      );
  
      console.log($(img[0]).attr("src")+' dimensions: '+pic_real[0]+' by '+pic_real[1]);
  
  });
  
  $('#listing_detail_photo_slider_strip').width(slideshoww).delay(500).css('top', '0px');
  
  // now position the prev/next slides
  // width:68px, height: 300px.
  var prevnexttop = (slideshowh-300)/2; // middle align the prev/next buttons vertically.
  $('#photo_slider_previous, #photo_slider_next').css('top',prevnexttop);
  
  activate_carousel();
  </code></pre>
  
  <p>}</p>
  
  <p>The console.log returns:</p>
  
  <pre><code>http://www.mydomain.ca/path/to/image.jpg dimensions: undefined by undefined
  </code></pre>
  
  <p>But when I put the console.log line WITHIN the function(){} portion under load(), it works. </p>
  
  <p>In other words, how do I use the returned variables pic</p>