title: IE thumbnail pixelation when high resolution image is set to small size
body: <blockquote>
  <p>Current version of plugin does not support fixing pixelation issue for
  images with transparent background. But it shows the way how to fix it
  using canvas. Adding WebGL functionality will make it faster and enable handling images
  with transparent background.</p>
  </blockquote>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$( document ).ready(function() {
      $('img.first').bicubicImgInterpolation({
              crossOrigin: 'anonymous' //for demo purpose
      });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://rawgit.com/sukhoi1/Crossbrowser-Bicubic-Image-Interpolation/master/bicubicInterpolation.js"&gt;&lt;/script&gt;
  
  Handled by &lt;b&gt;Bicubic Image Interpolation&lt;/b&gt; plugin:&lt;br&gt;
  &lt;img id="someId" class="first" width="200" src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/71/Text_Line_Length.png/800px-Text_Line_Length.png"&gt;&lt;br&gt;
  
  IE9 to IE11 and Edge &lt;b&gt;pixelated thumbnail&lt;/b&gt;:&lt;br&gt; 
  &lt;img class="second" src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/71/Text_Line_Length.png/800px-Text_Line_Length.png" width="200" alt=""&gt;&lt;br&gt;&lt;br&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>I have found a plugin, which seems to solve pixelation issue for all versions of IE and Edge browsers, it is called &quot;Crossbrowser-Bicubic-Image-Interpolation&quot;.</p>
  <p>Here is a code snippet which may solve the issue for many people using jQuery.</p>
  <p>Detailed <a href="https://github.com/sukhoi1/Crossbrowser-Bicubic-Image-Interpolation/wiki" rel="nofollow noreferrer">reference</a> to the problem on GitHub.</p>