Colorbox maxWidth、maxHeight not working

Question

使用可能なビューポートのみを使用してカラーボックスを設定する際に問題があります。 maxHeightまたはmaxWidth属性を設定すると、画像は表示されません。カラーボックスは開きますが、「回転ホイール」にとどまります。

function showImage(e) { 
    $.colorbox({href:$(e.currentTarget).attr("src")}); } 

jQuery(document).ready(function() { 
    $('.popout').on("click", showImage); 
    $('.popout').colorbox({rel:'popout', maxWidth:'95%', maxHeight:'95%'}); }); 

<img class="popout" src="my.jpg" alt="" width="500" height="373" /> 

私のコードで何が問題になっていますか？またはmaxWidth/heightを取得するために他の属性を設定する必要がありますか？

Answer 1

あなたはJSエラーを引き起こしているようです（ブラウザの開発コンソールを確認してください）。

しかし、あなたのアプローチには問題があります。代わりにこれを試してください：

jQuery(document).ready(function() { 
    $('.popout').colorbox({rel:'popout', maxWidth:'95%', maxHeight:'95%', href:function(){ 
     return this.src; 
    }}); 
}); 

<img class="popout" src="my.jpg" alt="" width="500" height="373" />