Question

我在这里有一个小小的Google地图应用：http://crocdoc.ifas.ufl.edu/projects/saveyourlogo/map/

此页面已通过iframe嵌入此页面的“操作”标签中：http://saveyourlogo.org/en/programs/crocodile/american-crocodile/

由于该页面以“Actions”内容div设置为display：none开头，因此我的map div（#map_canvas）从0x0开始，并且地图无法正确初始化。谷歌地图API说只需使用google.maps.event.trigger（map，'resize'）;一旦你的地图div调整大小。

由于我无法控制我的小地图的iframe之外的任何内容，因此我无法将调整大小功能附加到“操作”按钮。所以我试图检测#map_canvas div的大小的变化，然后激活resize函数。因为（我相信）你通常不能将resize事件附加到div，所以我使用了Ben Alman的jQuery resize事件脚本。（StackOverflow不允许我发布超过两个链接，但它很容易用Google搜索。）据说可以与IE8一起使用，我已经看到他网站上的示例了。

它在Firefox中完美运行，但在IE8中根本不会触发resize事件。（当我取消注释宽度警报时，它不会显示在IE8中。）

function reset_map() {
    google.maps.event.trigger(map, 'resize');
    map.setCenter(center); 
    map.setZoom(zoom);
}


$('#map_canvas').resize(function() {    
//  alert(document.getElementById('map_canvas').offsetWidth);
    reset_map();
});

知道为什么吗？或者也许建议更优雅的解决方案？

更新：我已经尝试构建我自己的小脚本，每隔300毫秒获取div的offsetWidth，然后将它与最后一个进行比较，但我最终崩溃了浏览器。有没有办法从display：none显示这个变化：没有使用常量，快速循环的块？我知道上面提到的Ben Alman的剧本每250ms使用一次。

检测div大小更改在IE中不起作用

0 个答案: