title: Changing image size Javascript depending on screensize
body: <p>Am using bootstrap, which for some reason means whenever i try the <code>@media (min-height: 1000px)</code> there is no response from the image class.</p>
  
  <p>I would like to run a javascript that resizes the image when the screen height gets above a certain size. (Lets say 1000 px)</p>
  
  <p>the best code I have found is this</p>
  
  <pre><code>&lt;script&gt;
      $(function() {
          if ($(window).height() &gt;= 710) {
              $("img").each(function() {
                  $(this).attr("src", $(this).attr("src").replace("logo1.png", "logo2.png"));
              });
          }
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>However when i replace src with width, and change the corresponding values of logo1.png and logo2.png to 500 and 800 nothing happens.</p>
  
  <p>Any pointers using Javascript very much appreciated.</p>
  
  <p>I tried this in CSS</p>
  
  <pre><code>@media screen and (max-width: 980px) and (min-height: 1000px) {
   .iphonegangster {
    min-width: 950px;
    height: auto;
   }
  </code></pre>