Switcher-stack on mobile problem

I’m using the Switcher-stack to create an tabbed screen. This works perfect on desktop, but on mobile i’m struggling with a big problem. On mobile the tabs are changed into accordion-tabs. If i open the first accordion and read the content in this tab , scroll down to complete the reading then i will click on the next accordion-tab and because i’ve scrolled down in the previous tab the new opened tab is displayed somewere in the middle and not at the beginning of the tab!! This is very annoying and makes my page hard to follow!! What is going wrong here??

Here you can try my site. Use it on mobile please to find out what i mean.

This problem is not only on the switcher-stack, it is an overall problem. An other page from my site is not using switcher tabs, it uses the Siphon-stack and also this stack gives me the same problem. If i scroll down to an item and click the next button, my site jumps to an point somewere in the middle, it should jump to the top of the content. I don’t really know what is wrong.

Try this link on mobile and see what i mean ,

Notifying @willwood

Since it’s happening on pages that don’t have the Switcher-stack, I don’t think it’s a problem with that stack.

I just tried the switcher stack page above and I guess I don’t see what you are talking about. It might be because I don’t understand the page content, or I don’t understand what you are saying.

On the "siphon-stack page, I’m lost as well.

I did note on my iPhone 7 that the Floating cart makes it hard to see a lot.

as far as switcher… there is a parameter you can set in the accordion section that determines which tab will be open when the page opens. Don’t have it in front of me but I think that a value of zero shows no tab open (just show the tabs), 1 = the first will be open and show, etc.

These snapshots show what i mean ,

This is the first unopenend tab.

I’ve openend the first tab(accordion) and scroll down to read the content.

Then clicked on the next tab(accordion) to open and show the content of it.
As you can see, the content is automatically scrolled to the bottom of the tab and is not beginning at the top of the tab.

This is how it should look like !!! when i’ve clicked on the next tab. open tab at top of the page to read.

Hope these pictures make sense. It has nothing to do with the Switcher-stack as i already mentioned, this appears on several pages that opens content on a click.

No one any solution for this problem??

Your first post and the thread title says it’s a problem with Switcher.

But then your second post contradicts this and says it is not a problem with Switcher?

In the meantime no one has contacted me direct to ask for help or raise any similar concerns about this stack on mobile.

I have tried to view your website and it’s just a gigantic mess of various stacks (over 36 different stacks) everywhere. Hardly something which anyone can easily review or comment on!

Reading this thread many times, I think what you are trying to poorly convey to us on the forums is that when an accordion opens, the top of it is obscured by the fixed-positioned elements?

That seems to be a consequence of the massive fixed header / hamburger / shopping cart filling most of the screen on small devices. And also why your webpage scrolls very roughly on mobile. You will want to find a way to ‘un-fix’ these elements, so they scroll with the rest of the page. In other words, simple is best.

If you need an accordion that focuses-in on itself when opened, you need to look at buying and using ZipList instead. But this will not fix the overlay and jerky scroll problem I discuss above - these are influenced by the other stacks you are using.

The site was created with the Foundation framework by Joe Workman and uses Rapidcart Pro for the shop-element. i’ve tested the site on various mobiles and it works fine on all of them (iphone 5 -> x). Exept the accordion. The accordion works well, exept the positioning when an tab is openend.
Were should i look at?

I’d start with a simple test page with nothing on it but the foundation site styles and your navigation.

Add the switcher stack with simple text within it.

One at a time start adding the other stuff, testing as you go. Once you’ve got a failure then you have figured out what caused the problem or conflict.

Then maybe someone can help you out.

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