title: responsive jquery image resizer
body: <p>I have made the following code for an image re-size based of max width and same goes for height using <code>.height()</code>. The problem is still that I cannot find a good responsive image re-size plugin or something like that could re-size image when we re-size browser. Is there anything that can be implemented in my code or any new responsive plugin known to anyone to re-size image automatically when the browser is re-sized plus a default <code>max-width</code> and <code>height</code>?</p>
  
  <p>my code for max width resize </p>
  
  <pre><code>// SET MIN AND MAX SIZE OF IMAGES
  if (lboxitem.find('.tp-mainimage').width() &gt; opt.maxWidth) {
      var oldimgw = lboxitem.find('.tp-mainimage').width();
      var oldimgh = lboxitem.find('.tp-mainimage').height();
      var perc = opt.maxWidth / oldimgw;
      lboxitem.find('.tp-mainimage').width(opt.maxWidth);
      lboxitem.find('.tp-mainimage').height(oldimgh*perc);
  }
  
  if (lboxitem.find('.tp-mainimage').width() &lt; opt.minWidth) {
      var oldimgw = lboxitem.find('.tp-mainimage').width();
      var oldimgh = lboxitem.find('.tp-mainimage').height();
      var perc = opt.minWidth / oldimgw;
      lboxitem.find('.tp-mainimage').width(opt.minWidth);
      lboxitem.find('.tp-mainimage').height(oldimgh*perc);
  }
  </code></pre>