Navigation Position Change on Resolution Switch?


I have a site design which would use left side vertical navigation, SVG icons with text animation on rollover, but when switching to mobile display uses bottom icon navigation to switch through pages to make it easy for phone users to navigate without stretching fingers.

Is this sort of nav position switch from left to bottom hypothetically possible using Blocs or is this the sort of design that is more suited to a hand coded work?


It is easy to do it, using two points, one for desk and another for mobile or at the point you want, it works for me wonderfully.




Nelo, thanks for the examples. This is what I have in mind with a few tweaks. The plan is to have the vertical navigation be SVGs that I’ve drawn up with a rollover behavior in a text fade in giving more detail. On click just loads another page with content with the nav vertical sidebar being persistent. Once the display resolution reaches mobile size the SVG icons would snap to the bottom of the display for usability sake. My guess is page formatting will be my greatest challenge as a new user, but I’ll get there.

I think it is possible, using the breakpoints, you can use the svg as buttons, that is also possible, there is a brics in the store that lets you make an animation from page to page that can serve you!

You will have an example of what you want to do! but I do believe that it is possible to do it!

1 Like

These are really elegant menus! Especially Serendipity. Did you do that all in Blocs, or is there some external coding being used?

yes, it was created with blocsapp, with two breakpoints, one for desktop and mobile is very good.

You add a code of fixed-left and it is of lateral way, while you create the menu of normal form in blocsapp.

cool thanks! really great work!