Docs

[Lumos]

When I tap on any Register Now button with an anchor ID, the popup won’t display. Sometimes if I tap on the edge of the button it works. According to the post from the plugin developer, there may be an X theme script that is affecting href with anchors in them.

Teen Acting – Level 1

https://wordpress.org/support/topic/ios-mobile-buttons-wont-open-popup/#post-8314964

[Rupok]

Hi there,

It seems you are using a static height for the button using the below code :

@media screen and (max-width: 979px)
.levels-page .x-btn.x-btn-flat.x-btn-small {
    height: 60px;
    line-height: 1.5em;
    clear: both;
    cursor: pointer;
}

You can try setting padding instead :

@media screen and (max-width: 979px)
.levels-page .x-btn.x-btn-flat.x-btn-small {
    padding: 20px
    line-height: 1.5em;
    clear: both;
    cursor: pointer;
}

Let us know if that works.

[Lumos]

Unfortunately that did not solve the problem.

[Rad]

Hi there,

Please add this code to Admin > Appearance > Customizer > Custom > Javascript.

jQuery( function($) {
$(window).load( function() {
$('.x-btn').off('touchend touchstart');
} );
} );

Thanks!

[Lumos]

Fantastic! It worked, thank you Rad & Rupok.

[Nabeel A]

Glad we could help 🙂

Cheers!

[Lumos]

Ahh darn, this new fix caused an issue on the site while viewing it on desktop. On the short Request Information form, when you click Continue, a second form is supposed to popup but now it scrolls to the top of the page and the form scrolls out of sight.

Film Acting School Toronto Academy of Acting Home

[Rue Nel]

Hello There,

This may have been just a caching issue. Since you have installed a caching plugin W3 Total Cache, please clear your plugin cache before testing your site. This can cause the changes to not take place on the front end. It will eventually show up when the cache regenerates, but it’s not ideal if you’re looking to see your changes immediately. Caching plugins are best to turn on only when you’ve finished building the site.

Please let us know how it goes.

[Lumos]

I tired clearing the cache, in incognito mode and disabled the caching plugin. It still automatically scrolls to the top after clicking Continue. Almost as if it’s scrolling to an anchor at the top of the page.

[Rue Nel]

Hello There,

Could please remove the jQuery that @Rad gave you and test your site again? That code may need to be updated by way of using this instead:

jQuery( function($) {
  $(window).load( function() {
    $('a[href="#contact_form_pop"]').off('touchend touchstart');
  } );
} );

Hope this helps.

[Lumos]

I tried the new code with a disabled caching plugin and on Chrome and Firefox, still causing the issue. It looks like this code and the previous does effect the button. When I remove the code, it doesn’t scroll up to the top but obviously the mobile issue comes back.

[Rad]

Hi there,

I checked it and it’s already working 🙂

What iOS version you’re testing it on?

Thanks!

[Lumos]

It scrolls to the top on desktop browsers. I am using Chrome. When I click on the button, the page automatically scrolls to the top.

[Lumos]

When you fill out the 3 fields near the bottom of the page and click continue, it scrolls to the top. See screenshot attached.

[Paul R]

Hi,

It seems to be working fine on my end.

See video – http://screencast.com/t/her8ul12

To fix your other button, kindly change the js code to this

jQuery( function($) {
  $(window).load( function() {
    $('a[href="#contact_form_pop"]').off('touchend touchstart');
    $('.wpcf7-form .wpcf7-submit"]').off('touchend touchstart');
  } );
} );

Hope that helps.

[Author]

Posts