jQuery Google地圖容器的動畫高度

我有一個地圖容器DIV。我們稱之爲#mapcontainer。jQuery Google地圖容器的動畫高度

我動畫的高度與jQuery：

$("#mapcontainer").animate({height: +=200px}, 500);

我知道，如果一個地圖容器的大小調整谷歌地圖需要觸發使用經過調整：

google.maps.event.trigger(map, 'resize');

現在很明顯的是要做到這一點在動畫的回調：

$("#mapcontainer").animate({height: +=200px}, 500, "linear", function(){ 
    google.maps.event.trigger(map, 'resize'); 
});

但這並不看起來光滑和地圖只是在動畫完成後突出高度。

無論如何，地圖可以調整大小，因爲動畫正在運行，因此地圖過渡平穩嗎？

來源

2012-02-09 Brady

您在動畫完成後觸發事件。這不是一個好的解決方案，但是也許你可以使用setInterval並在動畫運行時每隔1ms觸發一次事件。也許它會滯後，正如我所說它不是最好的解決方案。 – 2012-02-09 11:50:51

@SimonEdström - 謝謝我會放棄這一點。我會讓你知道這是怎麼回事 – Brady 2012-02-09 11:54:51

@SimonEdström - 看看http://jsbin.com/obitud/3/edit我能夠將更新設置爲100毫秒，而不是延遲。無論如何，你仍然有一點餘地，因爲這些瓷磚的一部分已經在摺疊之下了。 – Brady 2012-02-09 12:11:14

您在動畫完成後觸發事件，我認爲這是問題所在。

這不是一個好的解決方案，但也許你可以在動畫運行時每隔1ms使用setInterval和觸發事件。也許它會滯後，正如我所說它不是最好的解決方案。

var timer; 

timer = setInterval(function(){ google.maps.event.trigger(map, 'resize')}, 100); 
$("#mapcontainer").animate({height: +=200px}, 500, "linear", function(){ 
    timerMap = clearInterval(timer); 
});

來源

2012-02-09 12:30:27

jQuery Google地圖容器的動畫高度

回答

相關問題