Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

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!

share|improve this question
    
How is the button behaving now? –  Taylor H. Apr 3 '13 at 19:43
    
well, often the map and container resize as expected..but sometimes, the container and map do not expand to fullscreen, and instead stay anchored to the upper left corner of the screen...this behaviour is not consistent; generally but not always the fullscreen executes properly on the first few tries, then stops working... –  JasonBK Apr 3 '13 at 19:45

1 Answer 1

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

share|improve this answer
    
so how do I do that from the parent window, when the child window is created as it is above? Sorry but this does not really answer my question. –  JasonBK Apr 16 '13 at 15:47
    
The resize method is meant to be called when the map's container is resized manually via javascript. You should call it from the completion handler of your jquery animation. –  Dan Monego Apr 17 '13 at 20:47
    
OK, I think I see what you mean..but the map container is not the same as the map itself..the map belongs to a separate html from the parent ... so I am not sure what syntax to use to access it from the parent. I am using <object> to create the new frame, only b/c a co worker recommended against iframes..thoughts? –  JasonBK Apr 18 '13 at 14:23

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.