Pinning Control

[alleygirl]

I have a vertical menu pinned to side.  The problem is when scrolling down the page, the pinned vertical menu will NOT STOP before "FOOTER" section and scrolls over top.  How can I restrict it to not pass over the FOOTER area?

[Günter Heißenbüttel]

Please give us a link!

[alleygirl]

www.voltec-industries.com.....go to Industrial section and scroll down.

Thank you

[Günter Heißenbüttel · Accepted solution]

Place your menu vertically just above your footer (without making it a footer element) and pin it bottom right. This should solve your issue in most cases..

If the browser window is very small, the menu will overlap the header area now.

This is unavoidabe, because pinning is related to the browser window and not to the position or height of the footer.

Alternatively I’d suggest to use a different kind of menu, for example a menu build out of buttons in a single sheet composition, or – even better – a manual menu like the one you can check in this small.muse sample file: https://www.dropbox.com/s/jdilz0jtks09w9y/side-men%C3%BC.muse?dl=0

[alleygirl]

Pinning it in the bottom right corner pushed the menu off to the right side of the web page.  This makes me wonder about my page settings. So I pinned it bottom center position and it worked. I thank you for that as well as the visuals.

However,  the top part of the vertical menu now partially hides up in the header area.  Im trouble shooting  and trying to figure it out. Any further help would be greatly appreciated.

[alleygirl]

FYI....I figured it out.  It had to do with the page height as well as footer/header controls.  I appreciate your help.

[alleygirl]

Could you please go to www.voltec-industries.com, select "Industrial".  The vertical menu stops at the footer which is great.  But now it flows over top the header (no stopping point).  I've checked my header controller/page settings to no avail.  What has me stumped is that its working find under other master page tabs (automotive, electrical, rv) and I've compare them to each other, but not finding the difference??

[Günter Heißenbüttel]

What should I say? Did you read my post 3? Pinning is related to the browser window, not to header or footer. So you can’t achieve, what you want.

You’d have to definitely re-think this layout. I made a suggestion, if you follow my link in post 3.

[alleygirl]

Okay..understood.  I was trying to not reinvent the wheel.  Its interesting though that its only the industrial section that I cannot achieve my intent.  The other master pages are good to go.  Its just industrial section.  I will need to figure out plan B  I appreciate the sample you sent.

[Günter Heißenbüttel]

Perhaps it would be enough, if you change the layering of your header and footer elements by placing them on top of all other elements. Then your side menu will stop before reaching the footer (according to your actual design), and slide under the header elements, when the window is resized.

By the way: Actually you have to reduce you browser window in height considerably, before the side menu affects the header area. Do you think anybody will do this? Not a that big issue, I think. But if you look at my example, a two column menu like in my example will do the job quite well and there will not be any overlapping.

[Günter Heißenbüttel]

One more thing:

There is a free MuseThemes widget, which allows it, to come very close to you intention: „Scroll Reveal“

Here a sample file, showing, how it will work:

https://www.dropbox.com/s/svyz4mxgnbvaqhw/side-menu-2.muse?dl=0​

You find this free widget here: https://www.muse-themes.com/products/scroll-reveal

[alleygirl]

Thank you soooo much for your quick replies and expertise.  You've given me options that I will definitely use.  Very much appreciated.