title: retina.js not working - Don't know why
body: <p>I don't have much code to put in, but looking for help in order to save what hair is left on my head...</p>
  
  <p>I'm using retina.js, and it isn't working for any of the images. The @2x images are in the same folder as the smaller ones. One if them isn't exactly twice the size - designer sent me an image that was a pixel or two of - so I won't worry about that one as I assume that once the other images are loaded, this one will work when sized correctly.</p>
  
  <p>I've tried shorthand background:url(foo.jpg).... and background-image:url(foo.jpg), with and without the images in "". I've resigned myself to thinking I'm missing something stupid, and am just not seeing it. Any help would be appreciated!</p>
  
  <pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="../js/index.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../js/retina.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;ul class="grid" id="movie-grid"&gt;
  &lt;li class="movie"&gt;
    &lt;div class="poster"&gt;&lt;/div&gt;
    &lt;h2 class="title"&gt;&lt;a href="foo.html"&gt;Title&lt;/a&gt;&lt;/h2&gt;
    &lt;p class="desc"&gt;TV Movie&lt;/p&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>and the CSS:</p>
  
  <pre><code>    .poster {
   /*background:url(../images/comingsoon.jpg) no-repeat left top;*/
   background-image:url(../images/comingsoon.jpg);
   background-repeat:no-repeat;
   background-position:left top;
   display:block;
   width:204px;
   height:137px;
   background-size:100%;
  
   }
  </code></pre>