このコードの幅と高さを固定する方法

Question

$(document).ready(function(){  
$image_crop = $('#upload-image').croppie({ 
    enableExif: true, 
    viewport: { 
     width: 300, 
     height: 250, 
     type: 'square' 
    }, 
    boundary: { 
     width: 350, 
     height: 300 
    } 
}); 

幅と高さをパーセントで指定したいとします。上のコードの幅と高さをpxで指定します。

Answer 1

ないことが可能にこの瞬間のためにここで

が開かれた問題へのリンクの場合は確認してください。それでもhttps://github.com/Foliotek/Croppie/issues/280

、あなたはあなたが与えることはできません。この

viewport: { 
    width: 80 + '%', 
    height 80 + '%' 
} 

Answer 2

のような値を設定してみてくださいheightおよびwidthをパーセント単位で直接入力します。 ソースをチェックしauppliedパラメータがこのように取り付けられていることが判明：

（https://github.com/Foliotek/Croppie/blob/188585563069754b60385e590e8767cb9b394302/croppie.js:369）

css(viewport, { 
     width: self.options.viewport.width + 'px', 
     height: self.options.viewport.height + 'px' 
    }); 

しかし、事前絶対値をパーセンテージに変換し、それを

$(document).ready(function() { 
     function cropImage(widthPercentage, heightPercentage) { 
      var absWidth = (widthPercentage * $('#upload-image').width()) * 100; 
      var absHeight = (heightPercentage * $('#upload-image').height()) * 100; 
      $image_crop = $('#upload-image').croppie({ 
       enableExif: true, 
       viewport: { 
        width: absWidth, 
        height: absHeight, 
        type: 'square' 
       }, 
       boundary: { 
        width: 350, 
        height: 300 
       } 
      }); 
     } 
    }); 

を渡すことができ