Using sliding sidebar

Hi there.

I would like to know if you and your team can help me to reproduce the same sequency and rational as the iPad settings.

Files:

ipad_1:

ipad_2:

ipad_3:

I reproduce it: http://sidebar-settings.webflow.io/ and use DIVs to build each screen. The steps are:

  1. Click on “Open Sidebar”
  2. Click on “Notifications Central”
  3. Click on “>” of “Mail”

In this time, I would like to show over the same visual div location the Mail settings, but I can´t do it.

Other actions to know how to do are:

a) When click on “Close” button, the blue tabs close and after that the “sidebar” div closes.
b) When click on “Control Notifications”, if any blue is opened, must close (under “sidebar”) and open the repective content (div).
c) When I want to go back, I need to naviagte using the top “< Notifications Central” and “< Mail”.

What I used:

  • Divs whit content sliding under "sidebar” div.
  • When I use a idv over another one, the links on the div above are unavailable.

I really thanks your kind attention.

Hi @c_weare

Can you give us your read-only link please?

Hi! Sure!

Here we are: https://preview.webflow.com/preview/sidebar-settings?preview=78dc8d51c6a880d48afe5d4d3880e971

Hi @c_weare, from what it sounds like, you should be able to achieve this general layout in Webflow no problem.

This demo may be helpful:
Demo: https://preview.webflow.com/preview/demokit?preview=72388b288a26874be319ca1f7412d4eb
Page Title: Mulitple Navigation Bars (or any in the navigation folder may help)

​I hope this helps!

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