10

ColorBoxというjQueryプラグインを使用していて、基本的にjqueryモーダルを作成しますが、モーダルのサイズの高さは「500」に固定されており、最小の高さにしたいのですが、モーダル内にメニューを使用しているので、自動的に展開します。どうすればよいですか？
私が現在持っているコードは次のとおりです。 

$(".colorboxlink1").colorbox({
  opacity:"0.2",
  width:"450",
  height:"500",
  title:"To close this dialog click X icon at the right", 
  iframe:true
});

IvはこれからHeightを削除し、CSSを使用しようとしましたが、機能しませんでした。私はjqueryについて知っていることをこの行に入れようとしましたが、何も機能していないようですが、私はjQueryにかなり慣れていません。誰かアイデアがありますか？

4

4 に答える 4

21

これを使用できます：

$('.colorboxlink1').colorbox({ 
    onComplete : function() { 
       $(this).colorbox.resize(); 
    }    
});

カラーボックスが初期化された後のコードでは、これは次のとおりです。

$.colorbox.resize();
于 2012-10-17T15:07:02.930 に答える
2

同様の状況があり、setTimeout 関数を使用して、カラーボックスがロードされるまでの時間を与えてから、サイズ変更メソッドを呼び出しました。

カラーボックスに電話した

var profileHeight=jQuery('#profile').height(); //Get the height of the container     
    setTimeout(function (){
       jQuery.colorbox({
           html:jQuery('#profile').html(),
           width:'50%',
           height:profileHeight, 
           opacity:0.5})}
        , 600);
//Wait 700ms then resize
setTimeout(function(){jQuery(this).colorbox.resize();},700);

これにより、必要な機能が得られました。モーダル ウィンドウは常にコンテナのコンテンツに合わせてサイズ変更されます

于 2013-05-20T19:51:23.837 に答える
0

現在のバージョンの ColorBox を使用すると、最大サイズをパーセントで指定できます。

$(".colorboxlink1").colorbox({
    maxWidth: '95%',
    maxHeight: '95%'
});
于 2014-09-08T11:01:54.987 に答える