Navigation
Archive / Disable "draggable" in google map on mobile phones
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • January 19, 2017 at 2:33 pm #1337222
    c1s
    Participant

    Hi,
    i have set a google map which should be draggable on bigger screens and tablets.
    However, on mobile phones, the map should not be draggable.
    How is it possible to get this working?
    Thanks for your help!

    January 19, 2017 at 2:34 pm #1337224
    c1s
    Participant
    This reply has been marked as private.
    January 19, 2017 at 6:10 pm #1337516
    Rad
    Moderator

    Hi there,

    Thanks for posting in.

    Please add this CSS to Admin > Appearance > Customizer > Custom > CSS

    @media ( max-width: 979px ) {

.x-google-map {
pointer-events: none;
}

}

    Hope this helps.

    January 20, 2017 at 12:39 am #1337944
    c1s
    Participant

    Hi, thanks.
    There is a link on my google map which leads to google maps externally or the google maps app (on mobile devices). This links should of course still work on mobile devices.

    January 20, 2017 at 12:44 am #1337946
    Rupok
    Member

    Hi there,

    Thanks for writing back. It’s not possible to control the draggable functionality for mobile only. If you want to disable this, you need to do it for all devices – http://prntscr.com/dxyau5

    Cheers!

    January 20, 2017 at 4:48 am #1338178
    c1s
    Participant

    Hi!

    What happens if i duplicate the section of the map, and then turn the draggable function off and show this duplicated section only in mobile devices (and hide the other one in mobile devices)?

    Would this duplicated section substantially increase the data volume of the page that has to be loaded?

    January 20, 2017 at 8:10 am #1338339
    Joao
    Moderator

    Hi There,

    It would not be critical.

    Hope it helps

    Joao

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1337222 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>