Shape 5

General Category => Suggestions => : KlintWeb May 08, 2016, 08:06:43 PM



: Improvement to "Menu Scroll To Section"
: KlintWeb May 08, 2016, 08:06:43 PM
As You know I'm very satisfied with Your products.

But when we use "Menu Scroll To Section" on a site with "Floating Menu" we have a problem - the link position gets hidden behind the menu. I've tried to figure out what to do, but I couldn't find a solution without an override of the template index.php - and some CSS of course

I suggest that You add something like
:
<a class="anchor" name="s5_top_row1_anchor"></a>
just after
:
<div id="s5_top_row1">
in the index.php

The CSS can be something like the below, where the value of "top" can be set in Template Manager - the Vertex framework, to make it right depending of the hight of the Floating Menu
:
a.anchor {display: block; position: relative; top: -100px; visibility: hidden;height: 0;}
a.anchor:after {content"";}

If there already is a easier solution I'm looking forward to see it


: Re: Improvement to "Menu Scroll To Section"
: mikek May 09, 2016, 07:36:21 AM
Hello,

The css you have posted above will give a permanent gap on that area, not just when you use the scroll link. So even if you use just the mouse scroll you'll see the gap.

I have tried before to put in a javascript adjustment that changes where the scroll stops, but haven't been successful. Anchors are by default meant to go directly to that ID with no offest, it's just a defautl browser behavior. If I were able to get in an offset option that you define in the template configuration, it would apply to all anchors, is that something you would be interested in? I am not sure if it can be done, but I can look some more into it.


: Re: Improvement to "Menu Scroll To Section"
: KlintWeb May 09, 2016, 07:53:09 AM
It's quite simple - if the Floating Menu is disabled, the default CSS value for the top has to be 0, and if it's enabled another default value - depending of the template, which can be changed by the user to make it fit to the design.
Of course it would be good with javascript to control the value of the top to reduce the amount of CSS tags in the index.php head. But it should not be that difficult with the addition of the a tag.

You don't need to do it just for me, but I'm sure many others would be happy if a good solution is added