當模態div調整大小時，自動將Jquery SimpleModal重新定位到頁面中心

我使用SimpleModal Jquery插件，它效果很棒！當模態div調整大小時，自動將Jquery SimpleModal重新定位到頁面中心

但是，有時需要更改模態div的寬度和高度，所以我需要模態自動將其自身重新定位在頁面中心。我發現SimpleModal使用它的setPosition（）函數來做到這一點。當模式啓動時它會自動調用。

於是，我就打電話時語氣div的尺寸更改上述功能，但它不工作：

$('#mybutton').click(function() { 
    //code here to resize the modal 
    $.modal.impl.setPosition(); //doesn't work. note that at this point, the modal is still active (displayed) 
});

你有什麼想法？

來源

2010-07-13 Obay

在當前版本（1.3.5）中，您可以在回調中重新定位對話框。例如：

$('#foo').modal({ 
    onShow: function (dialog) { 
     var modal = this; // you now have access to the SimpleModal object 

     // do stuff here 

     // re-position 
     modal.setPosition(); 
    } 
});

我正在使用1.3.6版本，它將爲這些「實用程序」功能提供一些便利方法。

來源

2010-07-22 21:39:47

當您將一個元素（我們將其稱爲theElement）轉換爲模式時，它將被封裝爲div#simplemodal-container。 div#simplemodal-container將獲得相同的dimentions爲theElement（事實上，它會比theElement 2px的高/寬）

你不說你實際上是在調整什麼元素，但我想這是theElement。如果是這樣的話，#simplemodal-container的尺寸不會更新，而再次定位它將不起作用。您必須明確調整容器大小。

因此，調整後，再次定位之前，這樣做：

$("#simplemodal-container").css({height: newHeight, width: newWidth});

在這裏，我假設newHeight和newWidth是theElement的新dimentions（+2，如果你想跟着simplemodal的政策）

來源

2010-07-13 13:47:36

我這樣做，隨後通過調用$ .modal.setPosition（）...這爲我工作。 – 2016-02-17 21:15:42

@Blaise想確認將2條線組合在一起爲我工作。 $（「＃simplemodal-container」）.css（{height：newHeight，width：newWidth}）;和右$ .modal.setPosition（）; – azakgaim 2018-03-01 03:42:07

這個工作對我來說：

var modal = $.modal("<div>...</div>"); 


$('#mybutton').click(function() { 
    //code here to resize the modal 
    modal.setPosition(); 
});

來源

2011-02-01 00:49:21 Sebastian

當模態div調整大小時，自動將Jquery SimpleModal重新定位到頁面中心

回答

相關問題