Accordion fullscreen Page

RapidWeaver Classic Stacks
1

Hi,
I would like to create a website with a horizontal accordion menu like this.
Is there a stack for such a menu? Or is there a way to make this work?
Thank you!

2

Have a look at:

Ivy by Elixir here.

or

From Doobox Tab2 or FAQ2

There are others but these are easy to set u.

Regards

Mark

1 Like
3

Thank you!
The problem is, that there is no setting for fullscreen.

4

Maybe:
https://stacks4stacks.com/switcher

There’s a demo you can test before purchasing

1 Like
5

??? Not sure what you mean. How is the example you provided full screen? The accordion takes up part of the area, and then it seems there is a sidebar area.

… This is also dependent on what theme you are using. Certainly easy to do with super flexible themes like Foundry or Foundation, but also possible with some other themes. But it may not be possible with the specific theme you are using. Hard to know without more information.

1 Like
6

The example you provide looks like a Mac window in browser window… is that what you are wanting to duplicate? If so… my personal thought is that the last thing I would want in my browser was a faux Mac window. But if that is in fact what you desire, you won’t find anything to duplicate that. If you insist on the Mac window “effect” perhaps a screen shot of the top of a Mac window used somehow?

1 Like
7

maybe he’s trying to create something like this:

http://frontierimaginaries.org/editions/trade-markings

8

That’s a very nice look! Perhaps you are right. As far as I know nothing exactly like that can be done in RW, but I may be wrong. It has those nice overlapping areas.

9

Maybe I am reading this wrong (I usually do), but this can be easily done with any freeform theme, like Foundation, UIKit, Pure and Foundry. Here is an example of many accordion stacks listed above in Foundation.
http://www.zeebedesigns.com/full-screen-accordion

2 Likes
10

Thank you for all your replies. The effect I would like to achieve is, that the closed accordion stack has the height of the full screen. If I click one of the menus than it should look like in the example.

11

oh and I would like to use Foundation

12

Following from Rob’s example, you could have a Section pro inside your accordion tabs, and set it to 100% height (actually, it’d need to be less than that so that you could see the other menu items/accordion tabs). Here’s an example of an 80% high: https://www.jbostick.ca/test/accordion/

However, this probably has drawbacks in instances where someone resizes their browser (someone smarter than me could explain) or one the accordions doesn’t start open. Also, I’m still not sure this is what you’re going for.

I wonder if something like this could be repurposed? https://www.weaverskingdom.com/preview/3d-portfolio/.

13

Since your example is just an image, it is hard to tell if it has the full height of the page. Yes, that ONE accordion does go full page, but what about the other two?? It all depends on the content you put in it. The example that @jabostick shows will do what you want, but as he mentions, there could be issues with that as well.

I like the Weavers Kingdom example.

14

It would be possible to make an accordion type thing behave like this, But I don’t believe that there is one in existence.

The governors would be:

  • All closed titles below the currently open title stack aligned to the bottom of the current screen height.
  • The currently open title and all titles that preceded it stack aligned to the top of the current screen.
  • The current open content area scrolls to allow any amount of content.

The restrictions would be:

  • A limited amount of titles, as they’d quickly occupy the screen real estate leaving little room to display content.
  • Would need to occupy page alone, as there seems no way to provide any content above or below such a stack.
15

Thank you for all the great ideas! I like the 3d portfolio stack!

16

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