[GIS] call child div function from parent (not using window.opener)

arcgis-javascript-apihtmljavascriptjquerymapwindow

This is a a Javascript/JQuery question that is directly related to the ArcGIS Javascript API…

I have a map div created using a 'data' tag in HTML, which becomes visible on a button click.

(I'll call the map the 'child' and main page the 'parent' although I am not sure that is technically correct in this case?)

I would like to force a resize of the map when a 'fullscreen' button is clicked in the parent page. Generally the map resizes on its own but sometimes it does not…

How can I do this? I did not create a new window with 'window.open' …

My HTML for the child window is:

<div style='width:100%;  height:100%'><object type="text/html" style='width:100%;  height:100%' data='mapPage.html'>

..and the JS for the fullscreen button :

    mapFullscreen.click(function () {
    window.child.map.refresh(); // this doesnt seem to do anything

    $(mapContainer).animate({
        "height": $(window).outerHeight(),
        "width": $(window).outerWidth(),
       "top": 0,
       "left": 0

   }, 300, function(){
    $(".map-fullscreen").fadeOut();
  });
});

Thanks!

Best Answer

You need to call the resize() method on the map object if you change the size of the map div in javascript.