Hi Guys,
I have searched and tried lots of things in this forum for setting the CSS for a Map to be a full screen. None of it works across Browser and Native Clients. I want to try to code it so the map is full screen on any device of any size. Setting Css to 100% for height seems the answer but I can't get it to work.
Can anyone give me an example of how to do this? I have looked at other methods and forums and not working for me.
TIA
Molly
Hello! If there is only map on page and you want it to fill in 100% height create JS asset with the following code:
codefunction resizeMap() {
var divs = $("[dsid=googlemapName]");
if (divs.length) {
var mapDiv = divs.eq(0);
mapDiv.css("margin", "0");
mapDiv.css("display", "none");
mapDiv.height(mapDiv.parents('[data-role="content"]').height());
mapDiv.css("display", "block");
}
}
$(window).bind('resize', function(event) {
resizeMap();
})/code
where googlemapName - Google map component name
on page where you have map on Show event run:
coderesizeMap();/code
Perfect! Thank you so much! Works perfectly on Web, Mobile Web and Native Android App (Only haven't tried on iOS but sure it will work great)!
Hi Maryna:
I have a grid, image and the map on my screen.
I cannot fit my map in my screen.
I have loaded this code but does not fit the map on different screens. 
Hi Laura,
Please give us a public link to your app.
Hello! Thank you, we'll take a look and let you know.
Hi Laura! This issue seems to be not reproducible. See how it looks like on our side
Hello!!!
Not be that it happens but with this function that it fit before now not conforms to the map.
http://appery.io/app/mobile-frame?src...
Thaks!!!!!