title: fengyuanchen cropper how to set up dynamic fixed crop box
body: <p>I'm using a <a href="https://github.com/fengyuanchen/cropper/blob/master/README.md#methods" rel="nofollow noreferrer">crop tool from fengyuanchen</a>, which has awesome features. I'm trying to make a fixed crop-box with dynamic sizes.</p>
  
  <p>But I'm currently stuck just on how to figger out how to make it a certain size.</p>
  
  <p>I've tried the following:</p>
  
  <pre><code>$(function() {
  
      $('.img-container &gt; img').cropper({
        aspectRatio: 16 / 9,
        autoCropArea: 0.65,
        strict: false,
        guides: false,
        highlight: false,
        dragCrop: false,
        cropBoxMovable: false,
        cropBoxResizable: false,
        setCropBoxData('1600', '1200')
      });
  
  });
  </code></pre>
  
  <p>But <code>setCropBoxData</code> doesn't work for me. What am I doing wrong?</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>This should be the correct syntax to set up a fixed width for that actual cropbox, but I still don't get any results:</p>
  
  <pre><code>$(function() {
    var $toCrop = $('.img-container &gt; img');
  
    $toCrop.cropper({
      aspectRatio: 16 / 9,
      autoCropArea: true,
      strict: false,
      guides: false,
      highlight: true,
      dragCrop: false,
      cropBoxMovable: false,
      cropBoxResizable: false,
      built: function () {
        $toCrop.cropper("setCropBoxData", { width: "100", height: "50" });
      }
    });
  });
  </code></pre>