Weavium's Hop Stack navigation problem

[davidfreels]

I’m trying to incorporate the Hop Stack by @weavium into several RapidWeaver projects.

@weavium promises Hop is capable of “Beautiful animated pages with unlimited nesting”.

However, there’s a major navigation problem that’s even evident on @weavium’s Hop example page.

In the second example titled “We Build Digitial Products” found with this image:

.

Clicking on this section opens up three more “Hops,” titled “STARTER PLAN”, “PLUS PLAN”, and “PRO PLAN.” Clicking on each section opens the section, and then to close the section, there’s an “X” in the top right corner–however, the section doesn’t close.

The non-closing section freezes the page, and the only way out is to go back to the previous page, not the previous Hop section.

This navigation problem is also in the Hop Example project file provided by @weavium, the ‘Close Button’ setting to close all three of these ‘plan sections’ is actually set to “Back Arrow,” even though it renders as a non-working X.

A closer review of the @weavium Hop Example page reveals there’s only one ‘X’ example; the rest are all Back Arrows.

However, even when building Hop sections with either back arrows or X’s, the nested Hop sections won’t close and this results in the same page freezes seen in @weavium’s second Hop example..

Have other Hop users experienced similar problems? Is this related to over-nesting the “unlimited nesting” capabilities of Hop?

Thanks.

[jabostick (Jason Bostick)]

I can’t get the “We Build Digitial Products” example to freeze but maybe I’m not following your steps correctly… The X’s and arrows all seem to work properly for me (and I don’t get a non-working X, only the arrows for the Starter, Plus, and Pro plans). I’m on Chrome, byt the way…

[davidfreels]

Are you going through https://s3.ap-northeast-2.amazonaws.com/weavium-bucket/products/Hop/preview_page/index.html or via the example project file.

I did try to close out a Plan hop on the link above in Chrome on iOS and still had the same problem. The x doesn’t close it out and return to the previous Hop.

[jabostick (Jason Bostick)]

Through the link. But, I was looking via desktop. I see what you say now that I look at it on mobile.

I think the problem is that the X isn’t for any of the plans, it’s for the previous modal. The Starter, Plus, Pro arrows are stuck behind it. I’m not sure I’m explaining that correctly but it’s easier to see if you try on desktop first

[jabostick (Jason Bostick)]

Here’s my view on mobile

And here it is on desktop:

[davidfreels]

That’s interesting. Here’s how it renders on Safari desktop.

I hope @weavium gets a fix on this soon.

[Jerome (Jeroen Born)]

And did @weavium fix it?

[davidfreels]

No update from @weavium on Hop. Very disappointing.

[weavium]

Hi there,

I’m just seeing this. It looks like it must be some sort of a z-index issue. The examples are working for me on my end, so it must be a safari specific problem. I am looking into the issue now.

[weavium]

I’ve just pushed out an initial solution for this bug. (Version 1.0.2) It should work now. It could use some improvement, and I will continue to make it better. It turns out that the bug is specifically happening in Safari due to some major differences in relative positioning. I hope this helps~

[bendeparis (Ben)]

The icon disappeared with the last update (1.0.2)