Hi @tav
I appear to have an issue with a pop-drop launch that is specific to iOS and iPad
On desktop the pop drop launches as expected and closes as expected.
However on iPad the pop drop link when tapped momentarily flashes but does not launch.
The pop drop features within a Limelight in case this is a factor
The issue can be viewed by clicking the following link and launching the Patriot Plan product - this launches the Limelight page that itself contains url links to the offending pop drops
I’m on holiday and only have my phone. Are there any errors in the inspector after trying to open the PopDrop?
Hi @tav
Thanks for responding - I don’t wish to disturb what is probably a hard earned break for you.
I checked the desktop console (not sure if there is an ios version) and could not find anything that pertains to this issue.
As I will be attending Martens session later today perhaps its best I raise it in that session to see if we can isolate the problem.
If we can resolve I’ll be sure to let you know - if not perhaps we can pick up upon your return.
Kind Regards
Paul
PopDrop does require that it is present when the page loads. This may not be the case if you have it in a Limelight, particularly if Limelight is set to lazy preload so it may be worth trying it with that turned off.
P.S just for reference, you can inspect your iPhone or iPad when plugged in via USB; they will appear in the Develop menu of your desktop Safari.
Hi @tav
I can confirm that the pd issue only relates to when the page is called for within Limelight - if I load the page directly (external of Limelight) there is no issue with pd functioning on ipad.
Looked at all the LL settings but could not see anything obvious.
Never knew about the Safari Developer menu with IOS devices - must go and take a look.
Surely it is gin / tonic time for you now?
Paul
I’ve just re-read your original post. If it is only on touch devices then the issue cannot be one of being present on page load.
(2 Gin’s in so far)
Hi @tav
Just a quick update to advise that sadly we were unable to resolve the issue during our workshop session.
Hopefully we can pick this thread up after your bottle is finished and you have returned safely home.
Kind Regards
Paul
I have access to a laptop this evening in order to look at this. Unfortunately I can’t find the PopDrop to see it working on desktop before finding out why it doesn’t work on mobile.
You say the “links” in the Patriot limelight - any more clues?
All I can find is the link the opens a reveal modal from the picture and the links that open new windows.
What am I supposed to be clicking?
Hi @tav
Wow back so soon - did you run of gin??
So the issue manifests itself on IOS devices .
If you navigate to the https://csmltd.com/medical/travel-insurances page and scroll down to the “Single Trip” product and click either the image or the “Details” button a Limelight will launch.
Contained within the Limelight is another page from my site (it can also be referenced by its own url at https://csmltd.com/medical/travel-insurance-img-patriot)
Scrolling down this page you will come across 3 text links the first of which reads “Adventure sport option rider”
This and the other two links should open a pop-drop.
However on IOS devices the pop drop flashes into view momentarily and then disappears.
If however I go directly to the referenced Limelight page at https://csmltd.com/medical/travel-insurance-img-patriot and click either of the 3 links they will open on IOS devices.
This means to my untrained eye that there is an issue with opening pop drops that are contained within a Limelight.
I do hope the above assists.
Kind Regards
Paul
Back in the land of the living and I’ve had a look at this. Firstly, you have a JS error on the page as you appear to have added some custom JS to use the web font loader but the appropriate script is not being found when you run this code.
It would seem that the page is jumping to the top when the PopDrop links are clicked as the browser is returning the wrong scroll position of the page. I have made a simple test case which perfectly reproduces the problem https://test.bigwhiteduck.com/ll-popdrop/
This only occurs on iOS. When on desktop, the browser returns the correct scroll position relative to frame that it is in and PopDrop is positioned correctly. On iOS, the position comes back as 0 and the browser is scrolled to the top. PopDrop actually opens correctly but it then gets automatically closed by the scrolling action of the page.
I’ve tried a few things but nothing that will fix this. When something as fundamental as the scroll position of the page is reported erroneously to the JS code there is not a lot that can be done. It is very rare that there is not some sort of work around, but for this individual (and rather unusual) case I’m afraid the only solution is to find a different layout or combination of stacks. Sorry about that.
Hi @tav
Glad you made it back amongst us all hail and hearty!!
I am aware of the JS error you refer to and drilled down to identify it as an issue with the Yuzool navigation stack - Michael believes there may be a conflict with something else on the page but was unable to identify precisely what. I will drill down further on this issue shortly but as everything appears to be working it’s taken on a lower priority.
I am at least pleased that you identified my pop-drop issue and have been able to replicate it on IOS as discussed.
A little sad that a fix is elusive but will do as advised and re-think the solution.
Greatly appreciate all your efforts as usual.
Kind Regards
Paul
I’ll keep an eye on things. This sort of browser bug may well change with an iOS update.
Hi @tav
By way of feedback I made the decision to replace the Pop-Drops within Limelight with instances of @willwood Switcher stack that provides a very nice and simple text accordion to serve the additional content.
Regards
Paul
I think that is an excellent idea and is a much more user friendly interface.
Not that it will help, but I’ve replaced my navigation stacks in most of my sites with Yuzool’s navigation stack. To the best of my knowledge, I’m not having any issues with it conflicting with any other stacks.
Hi Dave
Thanks for your input.
I do and have liked the Navigation stack compared to most other options available - it’s just the pesky JS error code that constantly pops up in my console.
I am not using anything particularly that could be described as being esoteric but I guess I am going to have to spend time and discover precisely what is causing the JS errors within Yuzools Navigation stack.
It would be helpful if you could test your sites just to make sure.
Regards
Paul
Hey Paul - I just checked several sites, and I do not see any JS errors with Navigation. I DO see errors with his Boost stack (I really need to remove it from all of my pages).
On the other hand, I do have a webfoot error related to Navigation - perhaps @tav can have a look at < https://www.scdiag.com/locations/anderson/ > and let me know what I need to do. I don’t, by the way, use any Google Fonts in this site (and Navigation is set to use the theme font, which is a Font Pro - Adobe font).
You can see the Boost JS error on any other page of this site (I just removed it from the Anderson page).
This is the same as @paul.rowe 's error and just like his, it is the inline script at the start of the Navigation stack - really this has nothing to do with me so I shouldn’t really comment except to say that is trying to execute before the external webfont.js file has loaded.