[Plugin: Comprehensive Google Map Plugin] Move Directions DIV (placeholder) from below to above map

  • klogan2

    (@klogan2)


    11 years, 9 months ago

    Hi,
    I would like to know if it’s possible to move the Directions DIV(s) (placeholder-s) to open ABOVE the map, instead of below the map, as it is.
    The reason I want to do this is because I am devloping a theme for mobile/smart phones/tablets, and becuase of the non-mouse UI, the scrolling of the theme page AND the map, sort of work against each other. I’d rather have the map as full screen as possible (all scrolling is within the map) unLESS someone taps on get directions, then the directions DIV opens, pushing the map DOWN & out of the way. Get what I mean?
    I’ve been trying for about a day, and no matter what I move, the directions still open below the map.
    FABulous plugin BTW, works great.
    Cheers & all the best,
    Kevin Logan

    http://wordpress.org/extend/plugins/comprehensive-google-map-plugin/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter klogan2

    (@klogan2)

    11 years, 9 months ago

    Me again, same issue, but something I HAVE solved. I am using this plugin in a normal desktop fixed width theme, but I also want to use it in a mobile theme (same site). Overall, I am finding dealing withe the touch-screen device concept a challenge.
    My goal is to get the map to open on the screen, full screen, or at least full available screen, and essentially NO page scrolling. This part I have worked out. Still tweaking it, but the concept works:
    By using JS, getting the screen height variable, passing that to the URL, and then getting the variable using PHP, I can “echo” the value of the variable in the HTML for the height of the map, which must be set in PX (the width can be set in %), i.e. ($height-0)px. I added the -0 so I can tweak the height – or + if need be,, in fact I am, allowing for a div up top that has the page menu in it. here’s the page if you want to try (themidwaybb.com/wp-content/map_mobile3.php), at a few different window heights,, oh the width is set in % of course, so that is responsive as well. The page is a mess right now, becuase I am testing different browses, etc, AND I am having what I think is an overflow problem (see my other post I made today if U like).
    Assuming I manage to get the map full screen (Adjusted automatically for all devices), with NO (or little) scrolling, so that as the user scrolls around the map with their finger, they don’t accidentally move the page, IF they want to get directions, this is why I would like the Directions placeholder to open ABOVE the map, pushing the map down. The map form, works fine on a touch-screen device, and can be scrolled Up & down easily & typically. It would be nice that when the directions placeholder is closed, then the map moves back up, again, full screen, with the page more or less locked in position.
    So far, I’ve tried moving DIVs, Objects, etc,, but no good. I think tonight, I will look at the JS,, maybe something in there is determining the positions of the placeholders.
    So, Any ideas?
    All the best,
    Kevin

    Thread Starter klogan2

    (@klogan2)

    11 years, 9 months ago

    Last time on this subject, promise, because I figured it out. I needed to change the map_placeholder_and_directions.tpl file, by moving:
    <div align="MAP_ALIGN_TOKEN">MARKER_DIRECTIONS_HINT_TOKEN<div class="google-map-placeholder" id="MAP_PLACEHOLDER_ID_TOKEN" style="width: MAP_PLACEHOLDER_WIDTH_TOKEN; height: MAP_PLACEHOLDER_HEIGHT_TOKEN;"><div align="center" style="background:url('IMAGES_DIRECTORY_URI/loading.gif') no-repeat 0 0 transparent !important; height:100px; width:100px; position: relative; top: LOADING_INDICATOR_TOP_POS_TOKENpx !important;"></div></div>
    to the very bottom of the TPL
    Cheers all,
    Kevin Logan

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘[Plugin: Comprehensive Google Map Plugin] Move Directions DIV (placeholder) from below to above map’ is closed to new replies.