Content Area Modal on iPad not showing

Support
#1

Hi,

Although the Content Area Modal (X-Integrity 6.0.2) works on my desktop and on my Android phone (Chrome), it does not come up when I click the modal button/link on my iPad (iOS 11.2.x) even after clearing the cache. Is this a well known issue or am I doing something wrong? I do hope there is a solution.

Regards, Hans.

#2

Hi Hans,

Would you mind providing the URL of the site you are referring to so that we can check it?

Thank you.

#3

Under construction but no problem at all: www.xxx.xx The one on the left works, the two on the right don’t.

Best regards, Hans.

#4

Hi there,

I checked it on multiple devices and I can confirm this issue on 11.2. Though my debugging tool isn’t compatible with that version yet so I’ll have to update it first then I’ll continue checking and let you know. It’s quite a big update and I don’t usually do updates.

Thanks!

#5

Not so satisfied with your support after buying 5 lisences. I could not wait for over 5 days so I’ve asked someone else to solve my issue.

#6

Hi there,

Would you please kindly set up a test page for us on your installation and get back to us with the name of the test page and the URL/User/Pass of your website using the Secure Note functionality of the post?

That way we can check the case and follow up, meanwhile, we can see how you set up the page and try to recreate that on our installation to double check. If there is a bug we will surely report to our development team, and if it is only related to your environment we will do our best to find out the cause.

Meanwhile, I suggest that you follow the steps below:

  1. Ensure everything is up to date according to our version compatibility list here. Please follow the best practices when updating your theme and plugins. Click here for more information. The latest version of the theme is 6.0.4 and the Cornerstone 3.0.4.
  2. If you’re using a CDN, please clear the CDN’s cache and disable optimization services.
  3. Test for a plugin conflict. You can do this by deactivating all third-party plugins, and see if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
  4. Remove custom CSS and Javascript from the options or Child Theme and test the case.

Thank you.

#7

Hi Christopher,

Thanks for answering. After following your advice it turns out there still are problems. While visiting some pages on my iPad it shows strange behavior. Filling in the fields in the contact form (Formidable Pro, licensed) does not always work and some (sub-)menu buttons do not react. As mentioned above the modal button on contact-page seems to work but, also, not always. You can visit the site under www.lipocentrum.nl/NL.

Regards, Hans.

#8

Hi there,

I’m back again, I have to restore my iPad as the update caused issues, but it works after the update. When I restored it still works, so I’m not sure if this is specific to my X Code simulator or actual iPad.

I’ll continue checking and it will go to have a bit of delay, and since it now works okay then it would be harder to troubleshoot. I’ll see if I can find other devices.

Thanks!

#9

Hi,

Before I’ve build 4 sites with Theme X and never seen problems with Formidable Pro forms plugin. I’ve just uploaded a test page: http://lipocentrum.nl/NL/formtest/ with the same form shortcode as used on http://lipocentrum.nl/NL/contact/. On my iPad I can fill in the form on /formtest but not on /contact. The main difference between these pages is there is a Theme X modal on /contact. Can you confirm the form on /contact works on your iPad? Feel free to send the form, it is addressed to me and for the moment not to the site owner.

Regards, Hans.

Edit 2018-03-16: Two friends with each their own iPad - in a different network - confirmed the problem.

#10

Hi there,

Thanks for writing in.

Still on it, but would you mind adding this code to your global custom javascript. Maybe it’s related to touch event on your device which triggered twice.

jQuery ( document ).ready ( function($) {

setTimeout( function() {

$('.x-anchor-toggle').off('touchstart touchend');

}, 500 );

} );

Thanks!

#11

Hi,

Added the code but the issue remains.

Regards, Hans.

#12

Hi there,

I think I know what’s happening, it randomly works depending on the position of modal upon load. Please add this CSS to your global custom CSS.

.x-modal:not(.x-active) {
display: none !important;
}

I’ll add this to our issue tracker.

Thanks!

#13

Hi,

You’re right, this solved the problem and it looks to work correct now. Thanks!

Regards, Hans.

#14

Glad it worked :slight_smile:

#15

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.

#16

@TIS123

This looks like specific to your current modal setup and content and only happens on that page where the map is. All the fields located within the area of the map (invisible map) aren’t selectable. Still, you may use that CSS for permanent fix to this isolated case :slight_smile:

Thanks!