項目中有彈出層的內(nèi)容是不固定的，根據(jù)情況可能變長變短，于是就要求做layer彈出層的大小自適應(yīng)，查詢了api后發(fā)現(xiàn)

layer.iframeAuto方法可以實現(xiàn)，這里吐槽一點，ie瀏覽器的html沒有被body撐大，而iframeAuto方法是根據(jù)html的高度計算的，導(dǎo)致我之前出現(xiàn)在ie下，調(diào)用iframeAuto后高度直接變零。

好了，做好了這一點之后，測試又提出一個問題，因為他是用小屏幕測試的，上面的位置沒有變，彈出層變長以后按鈕就被擠到下面去了。所以我需要做一個效果，在彈出層長度改變后重新居中。

這時我就在網(wǎng)上開始找資料了，發(fā)現(xiàn)layer.style可以實現(xiàn)這個效果，但是很麻煩需要計算然后賦值。

正當(dāng)我決定用這個方案時，結(jié)果我在chrome控制臺測試layer.style時發(fā)現(xiàn)一個意外的效果。當(dāng)我移動控制臺邊界改變大小時，彈出層自動居中了。

移動前

移動后

實際上是觸發(fā)了父層的$(window).resize()。

然后我開始向這個方法實驗，但是不管是$(top.window).resize(),$(window.top).resize(),top.$(window).resize(),$(top).resize()都不能觸發(fā)top層的$(window).resize()方法。

最后還是沒有成功，我只好重新使用layer.style來計算了

var index = top.layer.getFrameIndex(window.name);//獲得layer彈出層索引
top.layer.iframeAuto(index, 30);//layer彈出層自適應(yīng)，改造的代碼，源代碼加上自己加的高度
var topHeight = ($(top.window).height() - $(window).height())/2;//計算高度
top.layer.style(index,{top:topHeight+"px"});//設(shè)置彈出層位置

中規(guī)中矩解決這個問題，不過還是不知道在彈出層是否能夠調(diào)用父頁面的$(window).resize()

完！

以上這篇layer實現(xiàn)彈出層自動調(diào)節(jié)位置就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com